Ajax Works Calling Function but javascript in function..

[elpaisa]

Hi!

Basically I have an Ajax function that calls a PHP function in another file, the call works fine, but the function has some javascript code, and it doesn't work

Any Ideas??

Tnx!

[A1ien51]

"The function has some JavaScript code" makes no sense at all.

1) I guess you mean that the responseText has JavaScript in it and it is not executing when you are setting it with innerHTML.

OR

2) you mean that code in your onreadystatechange is not firing?


Answers:

1) The JavaScript needs to be stripped out and put through eval(). JQuery does it by default, Prototype.js has a flag that you set to do it. If you roll your own, you need to figure out how to parse out the script.

2) We need to see your code.

Eric

[elpaisa]

Look, I have an Ajax function that fires a PHP function that shows a Form with a picklist, the code that fires the ajax function is a drop down, is basically like a country - state population I mean, one drop down selection displays its child in the other drop down, but the other dop down is a javacript pick list,

Please follow me, I am not so good for javascript as for php! any help is welcome

[elpaisa]

Hi!



Look, I have a drop down that fires an ajax function





onchange="getAdmin(this.value,'multipleselect','multipleselect')"





And here is an Ajax function that calls a PHP function



function getAdmin(countryId,action,divid) {

var strURL="ajaxfunct.php?actiond="+action+"&sectionid="+countryId;

var req = getXMLHTTP();



if (req) {



req.onreadystatechange = function() {

if (req.readyState == 4) {

// only if "OK"

if (req.status == 200) {

document.getElementById(divid).innerHTML=req.responseText;

} else {

alert("There was a problem while using XMLHTTP:\n" + req.statusText);

}

}

}

req.open("GET", strURL, true);

req.send(null);

}





Now it displays this php function:







echo '<style type="text/css">

.multipleSelectBoxControl span{ /* Labels above select boxes*/

font-family:arial;

font-size:11px;

font-weight:bold;

}

.multipleSelectBoxControl div select{ /* Select box layout */

font-family:arial;

height:100%;

}

.multipleSelectBoxControl input{ /* Small butons */

width:25px;

}



.multipleSelectBoxControl div{

float:left;

}



.multipleSelectBoxDiv

</style>';

echo'<script language="javascript" src="js/forms.js" type="text/javascript"></script>

<form method="post">

<select name="parents" id="parents" multiple>';



$getchild = mysql_query("SELECT optionid, optionname FROM attributes WHERE parentid = '$sectionid' ORDER BY optionname");

while($getchildren = mysql_fetch_array($getchild))

{

echo'

<option value="'.$getchildren['optionid'].'">'.$getchildren['optionname'].'</option>';

}

echo'

</select>

<select name="attributesto" id="attributesto" multiple></select><br />

<input name="submit" type="submit" value="Agregar a Este Producto" />

</form>

<script type="text/javascript">

createMovableOptions("parents","attributesto",500,300, \'Grupo\',\'Seleccionados\');

</script>';





That basically is a Multiple dropdown that takes the options from a database, but it shows the drop down and not the picklist javascript code that is assigned to this dropdown. now when the php function when is called directly, the picklist works perfectly

[ReyBango]

John,

Considering that you're using jQuery, I think you're XHR call is excessively complex considering you can do all of that using jQuery's $.ajax() method:

http://docs.jquery.com/Ajax

Your code could be shortened to something similar to this:

$.ajax({

url: "ajaxfunct.php?actiond="+action+"&sectionid="+countryId;,
cache: false,
success: function(html){
$("#divid").append(html);
}
});

Check that out and see if it helps.

Rey
jQuery Project Team

[elpaisa]

John,

Considering that you're using jQuery, I think you're XHR call is excessively complex considering you can do all of that using jQuery's $.ajax() method:

http://docs.jquery.com/Ajax

Your code could be shortened to something similar to this:

$.ajax({

url: "ajaxfunct.php?actiond="+action+"&sectionid="+countryId;,
cache: false,
success: function(html){
$("#divid").append(html);
}
});

Check that out and see if it helps.

Rey
jQuery Project Team

Yeah Thanks, is now Solved!

[ReyBango]

Glad I could help.

Rey....
jQuery Project Team