Hello jQuery Ninjas! I am trying, in vain it seems, to be able to pass additional parameters back to the success callback method that I have created for a successful ajax call. A little background. I have a page with a number of dynamically created textbox / selectbox pairs. Each pair having a dynamically assigned unique name such as name="unique-pair-1_txt-url" and name="unique-pair-1_selectBox" then the second pair has the same but the prefix is different.
In an effort to reuse code, I have crafted the callback to take the data and a reference to the selectbox. However when the callback is fired the reference to the selectbox comes back as 'undefined'. I read here that it should be doable. I have even tried taking advantage of the 'context' option but still nothing. Here is the script block that I am trying to use:
<script type="text/javascript" language="javascript">
$j = jQuery.noConflict();
function getImages(urlValue, selectBox) {
$j.ajax({
type: "GET",
url: $j(urlValue).val(),
dataType: "jsonp",
context: selectBox,
success:function(data){
loadImagesInSelect(data, $j(this))
} ,
error:function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(thrownError);
}
});
}
function loadImagesInSelect(data, selectBox) {
//var select = $j('[name=single_input.<?cs var:op_unique_name ?>.selImageList]');
var select = selectBox;
select.empty();
$j(data).each(function() {
var theValue = $j(this)[0]["@value"];
var theId = $j(this)[0]["@name"];
select.append("<option value='" + theId + "'>" + theValue + "</option>");
});
select.children(":first").attr("selected", true);
}
From what I have read, I feel I am close but I just cant put my finger on the missing link. Please help in your typical ninja stealthy ways. TIA