mohsen_zelzela00
سه شنبه 04 آبان 1389, 11:21 صبح
با سلام خدمت اساتید محترم
من برای ساختن یک فرم modal از Plugin این سایت (http://www.ericmmartin.com/projects/simplemodal/) استفاده کردم وقتی که یک دکمه html رو بیرون از grid بزارم این فرم من به خوبی کار می کنه و وقتی روی آن Button کلیک می کنم فرم modal برای من ظاهر میشه
حالا می خوام من این plugin رو در grid Asp.net استغاده کنم ولی این Modal فقط برای Row اول ظاهر میشه و برای Row های دیگه این فرم ظاهر نمیشه
<asp:Button ID="Button2" runat="server" Text="Buttonjjjjj" />
<div id="m" style="display: none;">
<%-- <a class="close" id="close" title="close"></a>--%>
<div>
<div class="he">
<span class="b">
سیستم حضور و غیاب
</span>
</div>
<%--<button id="addNewCustomerInstructionsClose" class="modalCloseImg">
Close</button>--%>
<h1>
<%-- style="display: none;"--%>
mohsen bahrzadeh</h1>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><asp:TextBox ID="TextBox2"
runat="server"></asp:TextBox><asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
<input id="Button4" type="button" value="add" />
<asp:Button ID="Button3" runat="server" Text="save" OnClick="Button3_Click" Style="display: none;" />
</div>
</div>
<asp:GridView ID="GridView1" runat="server">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<input id="Button1" type="button" value="buttonkkkkkk" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
و کد js
<script type="text/javascript">
$(document).ready(function() {
$('#Button1').click(function() {
// $.modal("<div><h1>SimpleModal</h1></div>");
$("#m").modal({
close: true,
onOpen: modalOpenAddCustomer,
onClose: modalOnClose,
persist: true,
containerCss: ({ width: "900px", height: "500px", marginLeft: "-250px" })
}
);
$('#close').click(function(dialog) {
$.modal.close();
});
});
function modalOnClose(dialog) {
dialog.data.fadeOut('slow', function() {
dialog.container.slideUp('slow', function() {
dialog.overlay.fadeOut('slow', function() {
$.modal.close(); // must call this to have SimpleModal
// re-insert the data correctly and
// clean up the dialog elements
});
});
});
}
function modalOpenAddCustomer(dialog) {
dialog.overlay.fadeIn('fast', function() {
dialog.container.fadeIn('fast', function() {
dialog.data.hide().slideDown('slow');
});
});
dialog.data.find(".modalheader span").html("Add New Customer");
// if the user clicks "yes"
dialog.data.find("#Button4").click(function(ev) {
ev.preventDefault();
//Perfom validation
$.modal.close();
$("#Button3").click();
});
}
});
</script>
ممنون میشم اساتید محترم راهنمایی کنند
من برای ساختن یک فرم modal از Plugin این سایت (http://www.ericmmartin.com/projects/simplemodal/) استفاده کردم وقتی که یک دکمه html رو بیرون از grid بزارم این فرم من به خوبی کار می کنه و وقتی روی آن Button کلیک می کنم فرم modal برای من ظاهر میشه
حالا می خوام من این plugin رو در grid Asp.net استغاده کنم ولی این Modal فقط برای Row اول ظاهر میشه و برای Row های دیگه این فرم ظاهر نمیشه
<asp:Button ID="Button2" runat="server" Text="Buttonjjjjj" />
<div id="m" style="display: none;">
<%-- <a class="close" id="close" title="close"></a>--%>
<div>
<div class="he">
<span class="b">
سیستم حضور و غیاب
</span>
</div>
<%--<button id="addNewCustomerInstructionsClose" class="modalCloseImg">
Close</button>--%>
<h1>
<%-- style="display: none;"--%>
mohsen bahrzadeh</h1>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><asp:TextBox ID="TextBox2"
runat="server"></asp:TextBox><asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
<input id="Button4" type="button" value="add" />
<asp:Button ID="Button3" runat="server" Text="save" OnClick="Button3_Click" Style="display: none;" />
</div>
</div>
<asp:GridView ID="GridView1" runat="server">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<input id="Button1" type="button" value="buttonkkkkkk" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
و کد js
<script type="text/javascript">
$(document).ready(function() {
$('#Button1').click(function() {
// $.modal("<div><h1>SimpleModal</h1></div>");
$("#m").modal({
close: true,
onOpen: modalOpenAddCustomer,
onClose: modalOnClose,
persist: true,
containerCss: ({ width: "900px", height: "500px", marginLeft: "-250px" })
}
);
$('#close').click(function(dialog) {
$.modal.close();
});
});
function modalOnClose(dialog) {
dialog.data.fadeOut('slow', function() {
dialog.container.slideUp('slow', function() {
dialog.overlay.fadeOut('slow', function() {
$.modal.close(); // must call this to have SimpleModal
// re-insert the data correctly and
// clean up the dialog elements
});
});
});
}
function modalOpenAddCustomer(dialog) {
dialog.overlay.fadeIn('fast', function() {
dialog.container.fadeIn('fast', function() {
dialog.data.hide().slideDown('slow');
});
});
dialog.data.find(".modalheader span").html("Add New Customer");
// if the user clicks "yes"
dialog.data.find("#Button4").click(function(ev) {
ev.preventDefault();
//Perfom validation
$.modal.close();
$("#Button3").click();
});
}
});
</script>
ممنون میشم اساتید محترم راهنمایی کنند