I've have following dialog pop-up HTML which is hidden initially when page loads(look line style="display:none;" in div):
<div id="searchPopContent" class="c-popup" style="display:none;">
<div id="pop-up">
<div class="error_msg" id="report_error" style="text-align:center; margin-top:5px;">
</div>
<div class="clear"></div>
<form name="question_issue_form" id="question_issue_form" class="login_box" method="post" action="question_issue.php">
<input type="hidden" name="form_submitted" id="form_submitted" value="yes"/>
<input type="hidden" name="post_url" id="post_url" value="question_issue.php"/>
<input type="hidden" name="op" id="op" value="question_issue"/>
<input type="hidden" name="question_id" id="question_id"/>
<table class="trnsction_details" width="100%" cellpadding="5">
<tbody>
<tr>
<td></td>
<td>
<input type="checkbox" name = "que_issue[]" value = "Question is wrong" id ="chkQueWrong">Question is wrong</input>
</td>
</tr>
<tr>
<td></td>
<td><input type="checkbox" name = "que_issue[]" value = "Answers are wrong" id ="chkAnsWrong">Answers are wrong</input></td>
</tr>
<tr>
<td></td>
<td><input type="checkbox" name = "que_issue[]" value = "Question direction is incorrect" id ="chkDirIncorrect">Question direction is incorrecct</input></td>
</tr>
<tr>
<td></td>
<td><input type="checkbox" name = "que_issue[]" value = "Other" id ="chkOther">Other</input></td>
</tr>
<tr>
<td></td>
<td class="set_message" style="display:none;"><textarea name="que_issue_comment" id = "que_issue_comment" rows="4" cols="25" maxlength="100"></textarea></td>
</tr>
<tr>
<td></td>
<td><input type="submit" name="submit" value="Submit" class="report_question_issue" class="buttonin"/></td>
</tr>
</tbody>
</table>
</form>
</div>
</div>
I want to dynamically set the value of input type hidden having id="question_id". After doing so much research I came to know that I have to use create() method of jQUery UI dialog plugin to set the hidden field value in UI dialog dynamically. I tried to call create() event in jquery dialog call but couldn't be able to set the value. Can anyone please help me in this regard please? Following is the code I tried to use create() event.
$(document).on("click","a[class='que_issue']", function (e) {
var hypertext = this.innerHTML;
var que_id = hypertext.substring(3);
//document.getElementById("question_id").value = que_id;
//$("#question_id").val(str);
var data = $('#searchPopContent').html();
var title = "Question issue";
var dialog_title = title;
var dialog_message = data;
var $dialog = $("<div class='view_result'></div>")
.html(dialog_message)
.dialog({
autoOpen: false,
modal:true,
title: dialog_title,
width: 400,
close:{
},
create: function() {
$("#question_id").val(que_id);
}
});
$dialog.dialog('open');
return false;
});
Also there is no errror in the firebug console for above code.
I modified your JS: http://jsfiddle.net/JyPLc/1/ , it works.
$(document).ready(function(){
$("#searchPopContent").dialog({
autoOpen: false,
modal:true,
title: "Question issue",
width: 400,
close:{
}
});
});
$("a.que_issue").on("click", function (e) {
var hypertext = this.innerHTML;
var que_id = hypertext.substring(3);
var title = "Question issue";
$("#question_id").val(que_id);
$("#qns_id").val(que_id); //this is just to show it works, can delete it
$("#searchPopContent").dialog('open');
return false;
});
You should modify the HTML first, then just call the dialog() to show to popup.
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments