c# - Button event not firing in javascript -
i've added jquery modal popup save upload files specific device. modal pops up, cancel button works, cant figure out how save button fire onclick event...
this i've done:
$(function () { $("#dialogcustuploads").dialog("destroy"); $("#dialogcustuploads").dialog({ title: "upload files", autoopen: false, modal: true, resizable: false, width: 'auto', buttons: { save: function () { $(document.getelementbyid('<%=btnsave.clientid %>')).click(); }, cancel: function () { $(this).dialog("close"); } } }); }); function showcustuploads() { $(function () { $("#dialogcustuploads").dialog("open"); }); $(".dialogcustuploads").parent().appendto($("form:first")); } <div id="dialogcustuploads" style="display: none"> <table style="width:100%;"> <tr> <td class="auto-style1"> <asp:label id="label16" runat="server" text="client"></asp:label> </td> <td> <asp:label id="lblclientuploadname" runat="server"></asp:label> </td> </tr> <tr> <td> <asp:label id="label19" runat="server" text="certificate no" ></asp:label> </td> <td> <asp:textbox id="txtcertificateno" runat="server" width="410px"></asp:textbox> </td> </tr> <tr> <td> <asp:label id="label14" runat="server" text="upload option"></asp:label> </td> <td> <asp:dropdownlist id="lstuploadoption" runat="server" appenddatabounditems="true" width="410px"></asp:dropdownlist> </td> </tr> <tr> <td class="auto-style1"> <asp:label id="label18" runat="server" text="file"></asp:label> </td> <td> <asp:fileupload id="fupath" runat="server" width="408px" /> <br /> <asp:label id="lblmessage" runat="server" text=""></asp:label> </td> </tr> <tr> <td class="auto-style1"></td> <td> <asp:button id="btnsave" style="display: none;" runat="server" text="save" onclientclick="btnsave_click" backcolor="white" /> </td> </tr> </table> </div> i'm not sure i'm missing or doing wrong... first time on javascript... appreciated!!!! savebutton nothing....
edit
thanks everyone's help! have updated button remove inline styling:
<asp:button id="btnsave" runat="server" text="save" onclientclick="btnsave_click" clientidmode="static" /> and i've tried using following have supplied me:
1. $("#<%=btnsave.clientid%>").click(); 2. document.getelementbyid('<%=btnsave.clientid %>').click(); 3. <asp:button id="btnsave" style="display: none;" runat="server" text="save" onclientclick="btnsave_click" clientidmode="static" backcolor="white" /> document.getelementbyid('btnsave').click(); 4. $('<%=btnsave.clientid %>').trigger("click"); but give me error message reads:
microsoft jscript runtime error: 'btnsave_click' undefined when form breaks button reads follows:
<input type="submit" name="ctl00$maincontent$btnsave" value="save" onclick="btnsave_click;" id="btnsave" /> is there else wrong i'm doing?
edit
this source code:
<script type="text/javascript"> $(function () { $("#dialog").dialog("destroy"); $("#dialog").dialog({ title: "message", autoopen: false, modal: true, buttons: { ok: function () { $(this).dialog("close"); } } }); }); function showmessage() { $(function () { $("#dialog").dialog("open"); }); return false; } $(function () { $("#dialogcustuploads").dialog("destroy"); $("#dialogcustuploads").dialog({ title: "upload files", autoopen: false, modal: true, resizable: false, width: 'auto', buttons: { save: function () { document.getelementbyid('<%=btnsave.clientid %>').click(); }, cancel: function () { $(this).dialog("close"); } } }); }); function showcustuploads() { $(function () { $("#dialogcustuploads").dialog("open"); }); $(".dialogcustuploads").parent().appendto($("form:first")); } </script> my div button click event:
<div id="dialogcustuploads" style="display: none"> <table style="width:100%;"> <tr> <td class="auto-style1"> <asp:label id="label16" runat="server" text="client"></asp:label> </td> <td> <asp:label id="lblclientuploadname" runat="server"></asp:label> </td> </tr> <tr> <td> <asp:label id="label19" runat="server" text="certificate no" ></asp:label> </td> <td> <asp:textbox id="txtcertificateno" runat="server" width="410px"></asp:textbox> </td> </tr> <tr> <td> <asp:label id="label14" runat="server" text="upload option"></asp:label> </td> <td> <asp:dropdownlist id="lstuploadoption" runat="server" appenddatabounditems="true" width="410px"></asp:dropdownlist> </td> </tr> <tr> <td class="auto-style1"> <asp:label id="label18" runat="server" text="file"></asp:label> </td> <td> <asp:fileupload id="fupath" runat="server" width="408px" /> <br /> <asp:label id="lblmessage" runat="server" text=""></asp:label> </td> </tr> <tr> <td class="auto-style1"></td> <td> <asp:button id="btnsave" runat="server" text="save" onclick="btnsave_click" /> </td> </tr> </table> </div> i call modal popup click in gridview:
<asp:gridview id="gvdevicecalibration" runat="server" cellpadding="10" width="90%" autogeneratecolumns="false" borderwidth="1px"> <headerstyle backcolor="#3a4f63" borderwidth="1px" font-size="7pt" wrap="false" forecolor="white" /> <rowstyle backcolor="white" wrap="true" /> <alternatingrowstyle backcolor="#ffcc99" wrap="true" /> <columns> <asp:boundfield datafield="id" headertext="id" readonly="true" sortexpression="id" ></asp:boundfield> <asp:boundfield datafield="instrumenttype" headertext="instrument type" readonly="true" sortexpression="instrumenttype"> <headerstyle wrap="true" /></asp:boundfield> <asp:boundfield datafield="make" headertext="make" readonly="true" sortexpression="make"> <headerstyle wrap="true" /> </asp:boundfield> <asp:boundfield datafield="location" headertext="location" readonly="true" sortexpression="location"></asp:boundfield> <asp:boundfield datafield="sublocation" headertext="sub location" readonly="true" sortexpression="sub location"> <headerstyle wrap="true" /></asp:boundfield> <asp:boundfield datafield="calibrationintervals" headertext="calibration intervals" readonly="true" sortexpression="calibrationintervals"> <headerstyle wrap="true" /></asp:boundfield> <asp:boundfield datafield="serialno" headertext="serial no" readonly="true" sortexpression="serialno"> <headerstyle wrap="true" /></asp:boundfield> <asp:boundfield datafield="workingrange" headertext="working range" readonly="true" sortexpression="workingrange"> <headerstyle wrap="true" /></asp:boundfield> <asp:boundfield datafield="classification" headertext="classification" readonly="true" sortexpression="classification"></asp:boundfield> <asp:boundfield datafield="calibrationdate" headertext="calibration date" dataformatstring="{0:yyyy/mm/dd}" readonly="true" sortexpression="calibrationdate"> <headerstyle wrap="true" /> </asp:boundfield> <asp:boundfield datafield="calibrationhouse" headertext="calibration house" readonly="true" sortexpression="calibrationhouse"><headerstyle wrap="true" /></asp:boundfield> <asp:boundfield datafield="owner1s" headertext="owner 1" readonly="true" sortexpression="owner1s"></asp:boundfield> <asp:boundfield datafield="owners2" headertext="owner 2" readonly="true" sortexpression="owners2"></asp:boundfield> <asp:boundfield datafield="createdby" headertext="created by" readonly="true" sortexpression="createdby"></asp:boundfield> <asp:templatefield headertext="select"> <itemtemplate> <asp:imagebutton id="updatestatus" runat="server" height="22" borderstyle="none" backcolor="transparent" imageurl="~/images/sign-select-icon.png" onclick="selectcaldevice_click" width="22" /><%-- --%> </itemtemplate> </asp:templatefield> <asp:templatefield headertext="upload"> <itemtemplate> <asp:imagebutton id="custuploadfiles" runat="server" height="22" borderstyle="none" backcolor="transparent" imageurl="~/images/uploadfilestrans.png" onclick="selectcustfiles_click" width="22" /> </itemtemplate> </asp:templatefield> <asp:templatefield headertext="view "> <itemtemplate> <asp:imagebutton id="custviewfiles" runat="server" height="25" borderstyle="none" backcolor="transparent" imageurl="~/images/msgicon.png" forecolor="transparent" width="25" onclick="viewcustfiles_click" /> </itemtemplate> </asp:templatefield> </columns> <emptydatatemplate> <headertemplate>there no leads listed.</headertemplate> </emptydatatemplate> </asp:gridview> and selectcustfiles_click show popup:
protected void selectcustfiles_click(object sender, eventargs e) { imagebutton lb = sender imagebutton; gridviewrow row = (gridviewrow)lb.namingcontainer; txtrowid.text = row.cells[0].text; lblclientuploadname.text = row.cells[1].text; populateuploadoptions(); //modalcustuploads.show(); this.page.clientscript.registerstartupscript(this.gettype(), "popupmessage", "showcustuploads();", true); } and click event i'm trying call script:
protected void btnsave_click(object sender, eventargs e) { // before attempting save file, verify // fileupload control contains file. if (fupath.hasfile) { // size in bytes of file upload. int filesize = fupath.postedfile.contentlength; // allow files less 2,100,000 bytes (approximately 2 mb) uploaded. if (filesize < 45497717) { // call helper method routine save file. //savefile(fupath.postedfile); savefile(); fupath.dispose(); lbljqmessage.text = "update successful"; this.page.clientscript.registerstartupscript(this.gettype(), "popupmessage", "showcustuploads();", true); //modalcustuploads.show(); } else lblmessage.text = "you did not specify file upload."; } } i'm getting error of 'btnsave' undefined...
this scripts i'm using:
<script src="scripts/jquery-1.7.1.min.js" type="text/javascript"></script> <script src="../scripts/jquery-ui-1.8.17.custom.min.js" type="text/javascript"></script> solved
i found problem... appended dialog in wrong place.. instead of this:
function showcustuploads() { $(function () { $("#dialogcustuploads").dialog("open"); }); $(".dialogcustuploads").parent().appendto($("form:first")); } it should be:
function showcustuploads() { $(function () { $("#dialogcustuploads").dialog("open"); }); } and instead of this:
$(function () { $("#dialogcustuploads").dialog("destroy"); $("#dialogcustuploads").dialog({ title: "upload files", autoopen: false, modal: true, resizable: false, width: 'auto', buttons: { save: function () { // __dopostback("<%=btnsave.uniqueid %>", ""); $($get("<%=btnsave.uniqueid %>")).click(); }, cancel: function () { $(this).dialog("close"); } } }); }); it should be:
$(function () { $("#dialogcustuploads").dialog("destroy"); var dlguploads = $("#dialogcustuploads").dialog({ title: "upload files", autoopen: false, modal: true, resizable: false, width: 'auto', buttons: { save: function () { // __dopostback("<%=btnsave.uniqueid %>", ""); $($get("<%=btnsave.uniqueid %>")).click(); }, cancel: function () { $(this).dialog("close"); } } }); dlguploads.parent().appendto(jquery("form:first")); }); thanks everyone's help!!! appreciate it!
document.getelementbyid('<%=btnsave.clientid %>').click(); or $('#<%=btnsave.clientid %>').click();
Comments
Post a Comment