Jump to content

2 ajax functions not working together

craygo

By craygo
in Javascript Help

 Share

Recommended Posts

craygo Member

craygo

Posted
Posted

I have a page which searches a database. on the page you can select the fields you would like to see and then there is a section where you can add search keywords. I have 1 ajax script which uses chained select boxes. the first box shows the available fields in the table to search with then depending on the selection it will show another select box if that field has only certain values you can use or just a text input to put what you like in. this works fine on it's own. I also want the option to click a button and add another set of search boxes so the user may search on more than one field. This also works fine, when you click the button another select box will fade in. The problem I have is when I use the script to add another select line the script to chain the select boxes breaks and it will not show the second select box.

 

I have attached screen shots.

 

I am using codeigniter I have not gotten the Ajax module down yet so I am just working with the javascripts and ajax files independently.

 

han_assets.php this is main page. pretty just echoing basic html code for the area.

      <tr>
        <td>
          <div id="form_data">
            <!-- the form fields will be loaded here via ajax -->
          </div>
          <div>
            <span id="loading"></span> 
            <input type="button" id="add_item" value="Add Search Field">
          </div>
        </td>
      </tr>

here is the ajax call

<script type="text/javascript">
var $j = jQuery.noConflict();
$j(document).ready(function() {
$j('#wait_1').hide();
$j('#drop_1').change(function(){
  $j('#wait_1').show();
  $j('#result_1').hide();
      $j.get("/reports/func.php", {
	func: "drop_1",
	drop_var: $j('#drop_1').val()
      }, function(response){
        $j('#result_1').fadeOut();
        setTimeout("finishAjax('result_1', '"+escape(response)+"')", 400);
      });
    	return false;
});
});

function finishAjax(id, response) {
  var $j = jQuery.noConflict();
  $j('#wait_1').hide();
  $j('#'+id).html(unescape(response));
  $j('#'+id).fadeIn();
}
</script>

func.php

<?php
//**************************************
//     Page load dropdown results     //
//**************************************
function getTierOne($table)
{
  $ret = '';
  $array = s_arrays($table);
  foreach($array as $key => $val){
    $ret .= '<option value="'.$key.'">'.$val."</option>\n";
  }
return $ret;
}

//**************************************
//     First selection results     //
//**************************************
if(@$_GET['func'] == "drop_1" && isset($_GET['func'])) {
   drop_1($_GET['drop_var']);
}

function drop_1($drop_var, $i=0)
{
  $text_fields = array("UNITID", "ADDRQUAL", "ADDRESS", "MAPNO", "INSTDATE", "STATPRES", "STATDATE", "RETIRED", "PIPELEN", "DIAM", "MISCDESC", "RETDDATE", "VALVESZ", "NOTURNS" );
  $stype = array("LIKE" => "LIKE", "=" => "=", "!=" => "!=", "NOT LIKE" => "NOT LIKE", "IS NULL" => "IS NULL");
  $array = s_arrays($drop_var);

echo '<select name="keyword['.$i.'][op]" id="tier_">';
  foreach($stype as $k => $v){
    echo '<option value="'.$k.'">'.$v.'</option>';
  }
  echo '</select>';

  if(empty($array)){
   echo '   <input type="text" name="keyword['.$i.'][value] id="tier_two">';
  } else {
echo '<select name="keyword['.$i.'][value]" id="tier_two">
      <option value=" " disabled="disabled" selected="selected">Choose one</option>';
  foreach($array as $key => $val){
    echo '<option value="'.$key.'">'.$val.'</option>';
  }

echo '</select> ';
  }
}

  function s_arrays($array)
  {
    $text_fields = array("UNITID", "ADDRQUAL", "ADDRESS", "MAPNO", "INSTDATE", "STATPRES", "STATDATE", "RETIRED", "PIPELEN", "DIAM", "MISCDESC", "RETDDATE", "VALVESZ", "NOTURNS" );
    $cont = 1;
    foreach($text_fields as $f){
      if(strstr($array, $f)){
        $ret = "noarray";
        $cont = 0;
      }
    }
    if($cont == 1){
      if(strpos($array, ".")){
        $ret = str_replace(".", "_", $array);
      } else {
        $ret = $array;
      }
    }
    $noarray = '';
    $oper = array("LIKE" => "LIKE", "=" => "=", "!=" => "!=", "NOT LIKE" => "NOT LIKE", "IS NULL" => "IS NULL");
    $COMPHY_SERVSTAT = array("I" => "In Service", "O" => "Out of Service", "CNU" => "Closed Non Use", "N" => "New Install", "T" => "Temp Out of Service");
    $COMPHY_AREA = array("CRAN" => "Cranston", "NPROV" => "North Providence", "PROV" => "Providence", "JOHN" => "Johnston", "SCIT" => "Scituate", "WESTCRAN" => "Western Cranston");
    $COMPHY_LOC = array("CR" => "Cranston", "JO" => "Johnston", "LI" => "Lincoln", "NP" => "North Providence", "PR" => "Providence", "SC" => "Scituate");
    $COMPHY_UNITTYPE = array("BR" => "Breakaway", "P" => "Post");
    $COMPWMN_SERVSTAT = array("I" => "In Service", "O" => "Out of Service", "CNU" => "Closed Non Use", "N" => "New Install", "T" => "Temp Out of Service");
    $COMPWMN_AREA = array("CRAN" => "Cranston", "NPROV" => "North Providence", "PROV" => "Providence", "JOHN" => "Johnston", "SCIT" => "Scituate", "WESTCRAN" => "Western Cranston");
    $COMPWMN_LOC = array("CR" => "Cranston", "JO" => "Johnston", "LI" => "Lincoln", "NP" => "North Providence", "PR" => "Providence", "SC" => "Scituate");
    $COMPWMN_PIPETYPE = array("AC" => "Asbestos Cement", "CI" => "Cast Iron", "CIR" => "Cast Iron Relined", "DI" => "Ductile Iron", "PC" => "PreStressed Concrete", "ST" => "Steel", "UN" => "Unknown");
    $COMPWMS_SERVSTAT = array("I" => "In Service", "O" => "Out of Service", "CNU" => "Closed Non Use", "N" => "New Install", "T" => "Temp Out of Service");
    $COMPWMS_AREA = array("CRAN" => "Cranston", "NPROV" => "North Providence", "PROV" => "Providence", "JOHN" => "Johnston", "SCIT" => "Scituate", "WESTCRAN" => "Western Cranston");
    $COMPWMS_LOC = array("CR" => "Cranston", "JO" => "Johnston", "LI" => "Lincoln", "NP" => "North Providence", "PR" => "Providence", "SC" => "Scituate");
    $COMPWMS_UNITTYPE = array("AIR" => "Air Release", "BLEED" => "Bleeder", "BLOFF" => "Blow Off", "SPH" => "Sprinkler Hydrant");
    $COMPWSL_SERVSTAT = array("I" => "In Service", "O" => "Out of Service", "CNU" => "Closed Non Use", "N" => "New Install", "T" => "Temp Out of Service");
    $COMPWSL_AREA = array("CRAN" => "Cranston", "NPROV" => "North Providence", "PROV" => "Providence", "JOHN" => "Johnston", "SCIT" => "Scituate", "WESTCRAN" => "Western Cranston");
    $COMPWSL_LOC = array("CR" => "Cranston", "JO" => "Johnston", "LI" => "Lincoln", "NP" => "North Providence", "PR" => "Providence", "SC" => "Scituate");
    $COMPWSL_SERVTYPE = array("COM" => "Commercial", "P" => "Public", "R" => "Residential", "SAMP" => "Sampling Station", "WHOL" => "Wholesale");
    $COMPWSL_PIPETYPE = array("COPPER" => "Copper", "LEAD" => "Lead", "AC" => "Asbestos Cement", "CI" => "Cast Iron", "DI" => "Ductile Iron");
    $COMPWSL_LINETYPE = array("COMB" => "Combination", "DOM" => "Domestic", "FS" => "Fire Service", "SFS" => "Special Fire Service", "WHOLE" => "Wholesale");
    $COMPWV_SERVSTAT = array("I" => "In Service", "O" => "Out of Service", "CNU" => "Closed Non Use", "N" => "New Install", "T" => "Temp Out of Service");
    $COMPWV_AREA = array("CRAN" => "Cranston", "NPROV" => "North Providence", "PROV" => "Providence", "JOHN" => "Johnston", "SCIT" => "Scituate", "WESTCRAN" => "Western Cranston");
    $COMPWV_LOC = array("CR" => "Cranston", "JO" => "Johnston", "LI" => "Lincoln", "NP" => "North Providence", "PR" => "Providence", "SC" => "Scituate");
    $COMPWV_UNITTYPE = array("B" => "Butterfly", "CHV" => "Check Valve", "GV" => "Gate Valve", "H" => "Horizontal", "PRV" => "Pressure Reducing", "TSV" => "Tapping Sleeve & Valve", "V" => "Vertical", "X" => "Bypass on Divisional");
    $COMPWV_VALVESTAT = array("O" => "Open", "C" => "Closed", "P" => "Partially Opened");
    $COMPHY = get_fields("COMPHY");
    $COMPWMN = get_fields("COMPWMN");
    $COMPWMS = get_fields("COMPWMS");
    $COMPWSL = get_fields("COMPWSL");
    $COMPWV = get_fields("COMPWV");
    return $$ret;
  }
  function get_fields($table)
  {
    $fields = array("$table.UNITID" => "Unit ID", "$table.ADDRQUAL" => "Qualifier", "(ADDRESS.STNO || ' ' || ADDRESS.STNAME || ' ' || ADDRESS.SUFFIX) AS ADDRESS" => "Address", "$table.AREA" => "Area", "$table.LOC" => "Loc", "$table.MAPNO" => "Map#", "$table.INSTDATE" => "Install Date", "$table.SERVSTAT" => "Status");
    switch($table)
    {
      case "COMPHY":
      $fields[$table.'.UNITTYPE'] = "Hydrant Type";
      $fields['VARHY.STATPRES'] = "Static Pressure";
      $fields['VARHY.STATDATE'] = "Static Date";
      $fields['VARHY.RETIRED'] = "Retired Date";
      break;
      case "COMPWMN":
      $fields['COMPTYPE.COMPCODE COMP1'] = "Comp Type";
      $fields[$table.'.UNITID2'] = "Unit ID 2";
      $fields['COMPTYPE2.COMPCODE COMP2'] = "Comp Type 2";
      $fields[$table.'.UNITTYPE'] = "Main Type";
      $fields[$table.'.PIPELEN'] = "Pipe Length";
      $fields[$table.'.PIPETYPE'] = "Pipe Type";
      $fields['VARWMN.RETIRED'] = "Retired Date";

      break;
      case "COMPWMS":
      $fields[$table.'.UNITTYPE'] = "Misc Type";
      $fields[$table.'.MISCDESC'] = "Description";
      $fields[$table.'.DIAM'] = "Diameter";

      break;
      case "COMPWSL":
      $fields[$table.'.UNITTYPE'] = "Service Type";
      $fields[$table.'.PIPELEN'] = "Length of Service";
      $fields[$table.'.PIPETYPE'] = "Pipe Type";
      $fields[$table.'.DIAM'] = "Diameter";
      $fields['VARWSL.RETDDATE'] = "Retired Date";
      break;
      case "COMPWV":
      $fields[$table.'.UNITTYPE'] = "Valve Type";
      $fields[$table.'.VALVESZ'] = "Valve Size";
      $fields[$table.'.VALVESTAT'] = "Valve Position";
      $fields[$table.'.NOTURNS'] = "# Turns";
      $fields['VARWV.RETIRED'] = "Retired Date";
    }

  return $fields;
  }

?>

and here is the ajax call to add the select box: addfield.js

window.addEvent('domready', function() {

var counter=0;
function new_rows(){
counter=counter+1;
var myHTMLRequest = new Request({
url:'/reports/load.ajax.php',
method:'get',
autoCancel:true,
data: {'type':'item','field_name':'add',num:counter},
onRequest: function() {
$('loading').set('html','<img src=\"images/ajax-loader.gif\">');
},
onComplete: function(responseText) {

var new_rows = new Element('div', {
'html': responseText
});
// inject new fields at bottom
new_rows.inject($('form_data'),'bottom');

//    remove loading image
$('loading').set('text','');
//    scroll down to new form fields
var myFx = new Fx.Scroll(window).toElement('table_'+counter);
}
}).send();
}
$('add_item').addEvent('click', function(e){
e.stop();  // stop the default submission of the form
new_rows();
});

//load first set of rows - all rows are loaded via ajax
new_rows();

});

 

Hope I explained it correctly

 

Thanks

 

Ray

 

 

 

[attachment deleted by admin]

Link to comment
Share on other sites
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.