how to call javascript function on onclientclick event of button resides in modalpopup

Question

_{Tuesday, May 27, 2008 10:23 AM}

in modalpopup one form is there.

now i want when user click on submit button, i want to validate the form,

for that on i write onclientclick event of submitbutton and call javascript function

onclientclick="javascript:return validation()"

but it doesnot call javascript function and gives javascript error.

how can i call the javascript function on onclient click event of button resides in modalpopup.

thanks

vishal parekh

All replies (17)

_{Thursday, May 29, 2008 8:47 AM ✅Answered}

Where are you putting the function? Cause you can't just make a scriptblock near the button, i had this error aswell when dealing with this problem. I solved it by putting the code in my Masterpage script block in the <head>.

Try and put the function there and see what happens.

_{Tuesday, May 27, 2008 10:39 AM}

what is the error you are getting? that could help trouble shoot

_{Wednesday, May 28, 2008 1:29 AM}

thanks jeev,

error is " object expected"

i cannot found where i made mistake.

thanks

vishal parekh

_{Wednesday, May 28, 2008 1:50 AM}

can you post your code..?then only we can troubleshoot...

_{Wednesday, May 28, 2008 6:20 AM}

function validation()

{

alert("hi");

}

<asp:Button ID="btntemp" runat="Server" Text="btntemp" />

<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender" runat="server" TargetControlID="btntemp"

PopupControlID="pnl" BackgroundCssClass="modalBackground" />

<asp:Panel ID="pnl" runat="Server" style="background-color:White;border-style:solid; display:none;border-width:2pt; border-color:#d4ffd4">

<asp:FormView ID="FormView1" runat="server" DefaultMode="Insert">

<table>

<tr>

<td>

<asp:Label ID="lblcity" runat="Server" Text="city"></asp:Label>

</td>

<td>

<asp:DropDownList ID="ddcity" runat="Server" OnPreRender="ddcity_PreRender"></asp:DropDownList>

</td>

</tr>

<tr>

<td>

<asp:Label ID="lblperiod" runat="server" Text="Period From"></asp:Label>

</td>

<td>

<asp:TextBox ID="fromDateTextBox" runat="server" ReadOnly="true" MaxLength="50"

CssClass="control" Width="85px">

</asp:TextBox>

<asp:Label ID="lblto" runat="server" Text="To"></asp:Label>

<asp:TextBox ID="toDateTextBox" runat="server" ReadOnly="true" MaxLength="50"

CssClass="control" Width="85px"></asp:TextBox>

</td>

</tr>

<tr>

<td>

<asp:Label ID="lblremark" runat="Server" Text="Remark"></asp:Label>

</td>

<td>

<asp:TextBox ID="remarkTextBox" TextMode="multiLine" Rows="2" runat="Server"></asp:TextBox>

</td>

</tr>

</table>

<asp:Button ID="InsertButton" runat="server" CommandName="Insert"

Text="Insert" OnClientClick="javascript:validation()" />

<asp:Button ID="InsertCancelButton" runat="server" CausesValidation="False"

Text="Cancel" />

</InsertItemTemplate>

</asp:FormView>

</asp:Panel>

vishal parekh

_{Wednesday, May 28, 2008 6:20 AM}

function validation()

{

alert("hi");

}

<asp:Button ID="btntemp" runat="Server" Text="btntemp" />

<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender" runat="server" TargetControlID="btntemp"

PopupControlID="pnl" BackgroundCssClass="modalBackground" />

<asp:Panel ID="pnl" runat="Server" style="background-color:White;border-style:solid; display:none;border-width:2pt; border-color:#d4ffd4">

<asp:FormView ID="FormView1" runat="server" DefaultMode="Insert">

<table>

<tr>

<td>

<asp:Label ID="lblcity" runat="Server" Text="city"></asp:Label>

</td>

<td>

<asp:DropDownList ID="ddcity" runat="Server" OnPreRender="ddcity_PreRender"></asp:DropDownList>

</td>

</tr>

<tr>

<td>

<asp:Label ID="lblperiod" runat="server" Text="Period From"></asp:Label>

</td>

<td>

<asp:TextBox ID="fromDateTextBox" runat="server" ReadOnly="true" MaxLength="50"

CssClass="control" Width="85px">

</asp:TextBox>

<asp:Label ID="lblto" runat="server" Text="To"></asp:Label>

<asp:TextBox ID="toDateTextBox" runat="server" ReadOnly="true" MaxLength="50"

CssClass="control" Width="85px"></asp:TextBox>

</td>

</tr>

<tr>

<td>

<asp:Label ID="lblremark" runat="Server" Text="Remark"></asp:Label>

</td>

<td>

<asp:TextBox ID="remarkTextBox" TextMode="multiLine" Rows="2" runat="Server"></asp:TextBox>

</td>

</tr>

</table>

<asp:Button ID="InsertButton" runat="server" CommandName="Insert"

Text="Insert" OnClientClick="javascript:validation()" />

<asp:Button ID="InsertCancelButton" runat="server" CausesValidation="False"

Text="Cancel" />

</InsertItemTemplate>

</asp:FormView>

</asp:Panel>

vishal parekh

_{Wednesday, May 28, 2008 7:13 AM}

No idea if it's the problem but to start out you don't close your <Script> Tag

Secondly, OnClientClick always assumes you call javascript an example of code i use: OnClientClick="OnClickLogin(); return false;"

So change yours to:

<asp:Button ID="InsertButton" runat="server" CommandName="Insert"

Text="Insert" OnClientClick="validation(); return false;" />

And see what happens, if you still get errors please post some more details about the error, remote debugging isn't as easy as some people would like ;)

_{Wednesday, May 28, 2008 8:27 AM}

Please try what kate pointed out and see if that fixes it ..

_{Thursday, May 29, 2008 7:11 AM}

thanks kate and jeev

there is already closing tag of script it didnot paste in above code,sorry for that.

i have tried your code but it doesnot call javascript function , in status bar i got javascirpt error symbol and when i click on that it gives

"object expected" error.

thanks

vishal parekh

_{Thursday, May 29, 2008 7:20 AM}

First off... please call me FB... or something.. :P "ten Kate" is my last name, and Kate sounds kinda like im a female, sadly... i'm a guy so i can't play with my own boobies :P

On a more serious note try it in firefox with firebug (firefox debug tool) enabled, and tell me where the object expected error is coming from exactly... copy the code that is generated and gives the error. Ow also, does this error show on pageload? or after clicking the button...

_{Thursday, May 29, 2008 8:03 AM}

sorry fb

when i run in firefox, javascript error is validation is not defind, and it gives error on line 1

this is the .ascx page (user control) and on default.aspx page i display them on condition , and javascript error display when i click on button not in page load,

in firefox when i viewsource, because of usercontrol and i conditionally visible them, and also i used contentplaceholder, it can not show me exact code in viewsource.

thank you.

vishal parekh

_{Thursday, May 29, 2008 8:09 AM}

hehe it's no problem ^^

Okay, this error means that the function called "validation" is not defined, pretty much meaning you forgot to add the following code:

function validation()

{

alert("succes");

}

Mind you, i believe javascript is case sensitive (must admit im not 100% sure, i always code Case sensitive just to be sure :P)

_{Thursday, May 29, 2008 8:22 AM}

i had already written that code,

but it could not findout that.

thanks

vishal parekh

_{Thursday, May 29, 2008 8:29 AM}

So it works now? :)

If it does, good. Please mark the post as answer which provided the answer and stuff :P like jeev has in his sig ^^

_{Thursday, May 29, 2008 8:39 AM}

no it doesnot work, same error

_{Thursday, May 29, 2008 9:09 AM}

hey, fb!

it works , it works fine,

thanks a lot,

but writing script in masterpage for other page sounds unwell

is there any other option to do same ?

again thank you.

vishal parekh

_{Thursday, May 29, 2008 9:17 AM}

Hmm, honestly i have the script in a .js file, and add this to the script manager as a reference.

<ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" CombineScripts="True">
            <Scripts>
                <asp:ScriptReference Path="Authentication.js" />
                <asp:ScriptReference Path="TakeThis.js" />
                <asp:ScriptReference Path="WebRequest.js" />
            </Scripts>
        </ajaxToolkit:ToolkitScriptManager>

But i have no idea if its possible to do it in a different way, i read something about registering Javascript from the server in an update. Not sure how though :-( So i'm just sticking with this for now. It's not a big file to download, plus the page i'm making basically has one page, and only gives a postback when changing language, or login, the rest of the page is completly done with AJAX calls :-| AJAX is lovely... but doing everything in AJAX isn't something i'll be doing again soon :p

(My boss thought this would be a nice excersize... the jerk ;-) )

Last updated on 2008-05-27

Share via

how to call javascript function on onclientclick event of button resides in modalpopup

Question

All replies (17)

Additional resources