Forums

Two same PHP scripts do not work on the same page.

Younger 02 Nov, 2013
The trouble is in the topic,and I'll show how it is:


<?php

$script = "window.addEvent('domready', function() {

        $('select_0').addEvent('change', function(event) {

      if ( $('select_0')[2].selected === true ) {

         $('text_box_1').setStyle('display', 'block')
$('text_box_2').setStyle('display', 'block');

      }

   });

   $('select_0').addEvent('change', function(event) {

      if ( $('select_0')[2].selected !== true ) {

         $('text_box_1').setStyle('display', 'none')
		 $('text_box_2').setStyle('display', 'block');

      }

   });

});

";

$doc=& JFactory::getDocument();
$doc->addScriptDeclaration( $script );
?>


<div class="form_item cf_dropdown" id="source_1_container_div" style="" ><label for="source_1"><b>Some Text here</b></label>

    <label class="cf_label"></label>

    <select class="cf_inputbox" id="select_0" size="1" {cf_multiple} name="select_0">

    <option value=""><color:'red'>Some Text here</color></option>

      <option value="Some Text here"><b>Some Text here</b></option>

<option value="Some Text here"><b>Some Text here</b></option>

 

    </select>

    

  </div>

  <div class="clear"> </div>

</div>

<div class="form_item" id='text_box_1' style='display:none;' >

  <div class="form_element cf_textbox">

    <label class="cf_label"><b>Some Text here</b></label>

    	<input class="cf_inputbox" maxlength="1500" size="30" id="text_1" name="text_1" type="text" />
<br>


<div class="form_item" id='text_box_22' style='display:none;' >

  <div class="form_element cf_textbox">

    <label class="cf_label"><b>Some Text here</b></label>

    	<input class="cf_inputbox" maxlength="1500" size="30" id="text_1" name="text_1" type="text" />

  

  </div>

  <div class="clear"> </div>

</div>
</div>


<div class="clear"></div><div 

 

id="error-message-input_text_17"></div></div>



<div class="ccms_form_element cfdiv_textarea" id="input_textarea_221_container_div" style=""><label>Some Text here</label><textarea cols="45" rows="12" class="" title="" name="input_textarea_22"></textarea>

<div class="small-message">  * Some Text here.</div><div class="clear"></div><div id="error-message-input_textarea_22"></div></div>








<h2>Some Text here</h2>
<div class="ccms_form_element cfdiv_text" id="input_text_301_container_div" style=""><label>Some Text here</label><input maxlength="1500" size="30" class="" title="" type="text" value="" name="input_text_30" />
<div class="clear"></div><div id="error-message-input_text_30"></div></div>

  
<?php

$script = "window.addEvent('domready', function() {

        $('select_0').addEvent('change', function(event) {

      if ( $('select_0')[2].selected === true ) {

         $('text_box_11').setStyle('display', 'block')
$('text_box_11').setStyle('display', 'block');

      }

   });

   $('select_0').addEvent('change', function(event) {

      if ( $('select_0')[2].selected !== true ) {

         $('text_box_11').setStyle('display', 'none')
		 $('text_box_22').setStyle('display', 'block');

      }

   });

});

";

$doc=& JFactory::getDocument();
$doc->addScriptDeclaration( $script );
?>


<div class="form_item_1 cf_dropdown" id="source_2_container_div" style="" ><label for="source_2"><b>Some Text here</b></label>

    <label class="cf_label"></label>

    <select class="cf_inputbox" id="select_0" size="1" {cf_multiple} name="select_0">

    <option value=""><color:'red'>Some Text here</color></option>

      <option value="Some Text here"><b>Some Text here</b></option>

<option value="Some Text here"><b>Some Text here</b></option>

 

    </select>

    

  </div>

  <div class="clear"> </div>

</div>

<div class="form_item_1" id='text_box_11' style='display:none;' >

  <div class="form_item_1 cf_textbox">

    <label class="cf_label"><b>Some Text here</b></label>

    	<input class="cf_inputbox" maxlength="1500" size="30" id="text_1" name="text_1" type="text" />
<br>


<div class="form_item_1" id='text_box_22' style='display:none;' >

  <div class="form_item_1 cf_textbox">

    <label class="cf_label"><b>Some Text here</b></label>

    	<input class="cf_inputbox" maxlength="1500" size="30" id="text_1" name="text_1" type="text" />

  

  </div>

  <div class="clear"> </div>

</div>
</div>


<div class="clear"></div><div 
id="error-message-input_text_17"></div></div>
Younger 02 Nov, 2013
So, when I see the form, first of dropbox shows 3 texbox (text_box_1, text_box_2) and "text_box_11"...But it's not the action that I wait from him!
I need that different "dropboxes" works asynchronously.

Please, help me, becuase I do not see where is error hiding.
GreyHead 02 Nov, 2013
Hi Younger,

Please explain exactly what the problem is?? At the moment I'm having to guess :-(

Bob

PS I suspect you mean that two JavaScript scripts won't work together?
Younger 02 Nov, 2013
oh, I'm sorry!

I'll upload screenshots, please look on them.
Younger 02 Nov, 2013
So, It's doesn't matter, which kind of answer I chosen in second dropdown-first dropdown is control situation:
If it will be 'yes', then both dropdown shows hidden textboxes.
I trying to make them asynchronously.
GreyHead 04 Nov, 2013
Hi Younger,

That will happen if both sets of inputs have the same ids. If you give them different ids and change the scripts to use those ids it should work the way you want it to.

Bob
Younger 07 Nov, 2013
Thank for reply, Bob!
I'll try this way.
This topic is locked and no more replies can be posted.