Setting the value of an input within an html string returned via ajax
I was wondering if there was a way to set the value of an input (returned via an ajax call) before appending it to the document.
$(function () {
$("#addItem").click(function () {
var numRows = $('.row').length;
$.ajax({开发者_开发百科
url: this.href,
cache: false,
success: function (html) {
// find input id in html that contains Order ?
// set value of the input to numRows + 1 ?
// append updated html to an element called #rows
$("#rows").append(html);
}
});
return false;
});
Thanks for any help
Here's what the html might look like
<div class="row">
<input type="hidden" name="OfficialAddresses.index" autocomplete="off" value="1cffe209-44e1-44ca-a013-a808bff8a174">
<fieldset>
<legend>Address</legend>
<div class="editor-field">
<input class="text-box single-line" id="OfficialOfficialAddresses_1cffe209-44e1-44ca-a013-a808bff8a174__Order" name="OfficialOfficialAddresses[1cffe209-44e1-44ca-a013-a808bff8a174].Order" type="text" value="0">
</div>
<div class="clear">&nsbp;</div>
<a href="#" class="deleteRow">delete</a>
<div class="clear">&nsbp;</div>
</fieldset>
</div>
Assuming the input's ID is Order
:
success: function (html) {
var $html = $(html);
$html
.find('#Order') // find input id in html that contains Order
.val(numRows + 1); // set value of the input to numRows + 1
// append updated html to an element called #rows
$("#rows").append($html);
}
If you really mean that the input's ID only contains order, use a fancier selector:
$html.find('input[id*=Order]').val(numRows + 1);
yes there is. If you put the returned content into a jQuery object, then you can perform selections on elements contained within and set the value.
e.g.
$.ajax({
url: this.href,
cache: false,
success: function (html) {
var htmlToAppend = $(html);
// do your searching and value setting here
// append updated html to an elemen called #rows
$("#rows").append(html);
}
});
$(function () {
$("#addItem").click(function () {
var numRows = $('.row').length;
$.ajax({
url: this.href,
cache: false,
success: function (html) {
$('#Order', html).val(numRows+1);
// append updated html to an elemen called #rows
$("#rows").append(html);
}
});
return false;
});
});
whell, a workaround could be to insert the new html in a hidden div, then find the "order ?" input and set the value to wathever you want
精彩评论