How to set the OnClientClick value - syntax? - javascript

ASP.NET coding in VB.NET -- web application.
I am asking a few questions about the "proper way" to set the OnClientClick phrase in the aspx button declaration.
Option 1: leading with 'javascript:' and surrounding the js in {...}
<asp:Button ID="btnDelete" runat="server" CausesValidation="False" SkinID="cmdButton" style="margin-left: 2em;"
CommandName="Delete" Text="Delete"
OnClientClick = "javascript:{(!confirm('Do you want to delete this record?'); return false;}"
Option 2: Not leading with 'javascript:' and NOT surrounding the js in {...}
<asp:Button ID="btnDelete" runat="server" CausesValidation="False" SkinID="cmdButton" style="margin-left: 2em;"
CommandName="Delete" Text="Delete"
OnClientClick="if (!confirm('Do you want to delete this record?')) return false;"
Both options appear to work properly in IE-10, but have not tried other browsers. So I am curious about the different phrases.
What about the leading of 'javascript:'? -- what affect does this have?
What about the surrounding of the js with {...} -- what affect does this have?
Your comments are welcome -- what is the best way to construct the phrase.
Any other syntax (or style) or suggestions will be welcome.
Thanks, in advance...John

OnClientClick renders into the standard HTML onclick attribute, so put whatever works with it.
I.e. - no javascript prefix required, no brackets required as well.

Related

how to add value inside JavaScript function?

error: linked button The server tag is not well formed.
I am using VB asp.net and JavaScript
I have a linked button inside repeater. When user click on remove button then I want to run onclick() function and pass in a eval() value.
after that I want to get the value inside javascript function.
Note, creating hidden field wont work because it is inside repeater and there is no way for me to get the value inside JavaScript function.
function RemoveItemJS(obj) {
alert("test" + obj);
}
vb asp.net repeater code:
<asp:Repeater ID="BagRepeater" runat="server">
<ItemTemplate>
<asp:HyperLink ID="ProductNameHL" NavigateUrl='<%# Eval("Product_ID", "../Shop/ShopDetail.aspx?Product_ID={0}") %>' runat="server">
<h4 class="Text-Spacing"><%# Eval("Name")%></h4>
</asp:HyperLink>
<h5><strong>$<%# Eval("Price") %></strong></h5>
<h5>Color: <%# Eval("Color") %></strong></h5>
<h5>Size: <%# Eval("Size") %></strong></h5>
<h5>QTY: <%# Eval("QTY") %></strong></h5>
<asp:LinkButton ID="RemoveItemLB" OnClientClick="RemoveItemJS('"+<%# Eval("Product_ID") %>+"');" runat="server"><span class="glyphicon glyphicon-remove"></span></asp:LinkButton>
</ItemTemplate>
</asp:Repeater>
Try with 'onclick'
<asp:LinkButton ID="RemoveItemLB" onclick='<%# "RemoveItemJS(" +Eval("Product_ID") + " );" %>' runat="server"><span class="glyphicon glyphicon-remove"></span></asp:LinkButton>
Follow the approach as below. I have tried this and it works.
You need to escape the quotes inside the value of onclientclick
property as in code below.
Note that double quotes are escaped with a backslash i.e. \
character and also the entire JavaScript code is emitted from
server-side tag.
Use & as string concatenation operator in VB.Net and not + within a server-side expression in markup.
OnClientClick='<%# "RemoveItemJS(\"" & Eval("Product_ID") & "\")" %>'

calling a javascript function from a telerik RadButton

I'm new to both WebForms and Telerik and have the following table cell:
<td class="gridtd">
<telerik:RadButton ID="btnOpslaan" Text="Verder" runat="server"
autopostback="false" OnClientClicked='<%# "return (function()
{EditLocatie("+ Eval("_userId") + Eval("_nextViewName") + ");})" %>' />
<telerik:RadButton ID="btnAnnuleer" Text="Terug" runat="server" CausesValidation="false" />
</td>
I expect a button which calls the described javascript function when I click it, but it does not. I have no idea what I am doing wrong here. I tried removing runat="server", but it seems this attribute is required. Does anyone else know what the problem could be?
It seems that the javascript code you are generating is incorrect.
Try to replace the contents of OnClientClicked='...' with
OnClientClicked='<%# "return EditLocatie(\'" + Eval("_userId") + Eval("_nextViewName") + "\');" %>'.
This should generate a code similar to this:
return EditLocatie('... the result of Eval _userId + Eval _nextViewName...');

Passing variables to javascript in repeater imagebutton onclientclick

I want to pass my dynamic value to a javascript function from an imagebutton onclientclick event.
It works fine if I pass the static value like this
<asp:ImageButton ImageUrl="~/Images/control_play_blue.png" ForeColor="Transparent"
BorderStyle="None" ToolTip="Chat" runat="server" ID="btnChat"
OnClientClick="javascript:return openWindow('1')" />
However it doesn't work if I try to pass dynamic values as below.
<asp:ImageButton ImageUrl="~/Images/control_play_blue.png" ForeColor="Transparent" BorderStyle="None" ToolTip="Chat" runat="server" ID="btnChat"
OnClientClick="javascript:return openWindow('"+<%#Eval("PujaType") %>+"')" />
I tried all possible combinations however it says tag is not well formatted.
Can anyone help on this?
Don't know ASP, but in JSP the expression has to be the entire value. Try:
OnClientClick="<%# "javascript:return openWindow('" + Eval("PujaType") + "')" %>" />
You don't need string concatenation around your Eval statement. Doing so is creating invalid markup.
Change
"javascript:return openWindow('"+<%#Eval("PujaType") %>+"')"
to
"javascript:return openWindow('<%#Eval("PujaType") %>')"
<asp:ImageButton
ImageUrl="~/Images/control_play_blue.png"ForeColor="Transparent"
BorderStyle="None" ToolTip="Chat" runat="server" ID="btnChat"
OnClientClick="javascript:return openWindow('<%#Eval("PujaType") %>')" />
Its been awhile since I have worked with ASP.NET and currently cannot test this, but I seem to recall it requiring single quotes when wrapping the <%# %>.
Something like this:
<asp:ImageButton ImageUrl="~/Images/control_play_blue.png" ForeColor="Transparent"
BorderStyle="None" ToolTip="Chat" runat="server" ID="btnChat"
OnClientClick='<%# "javascript:return openWindow('" + Eval("PujaType") + "')" %>' />
Some of the answers on this question suggest the same.
An alternative would be setting the value in the code behind. Assuming you are using this control inside a repeator or something similar, you should be able to set the value during data binding like this:
void R1_ItemDataBound(Object Sender, RepeaterItemEventArgs e) {
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem) {
String pujaType = ((YourType)e.Item.DataItem).PujaType;
((ImageButton)e.Item.FindControl("btnChat")).OnClientClick = "javascript:return openWindow('" + pujaType + "')";
}
}
Repeater.ItemDataBound Event
Another alternative, since you are not making use of any serverside events, would be to use regular html instead of an ASP.NET control. This could be done with an anchor and img tag like so:
<a href="#" onclick="openWindow('<%# Eval("pujaType") %>'); return false;">
<img src='<%= ResolveUrl("~/Images/control_play_blue.png") %>' />
</a>

JavaScript alert with label's text

Quick and silly question perhaps, but how do I pass a label's text into a javascript confirm or alert function?
Here is what I've done but it's not good:
<asp:Label ID="lblGVDeleteMessage" runat="server" Text="Show me!" style="display:none;" ></asp:Label>
<asp:ImageButton ID="btnDelete" runat="server" AlternateText="Delete"
CommandName="Delete" Height="15px" ImageUrl="~/Images/document_delete.png"
OnClientClick="return confirm('#<%=lblGVDeleteMessage.ClientID%>')"
Width="15px" />
Thanks!
You need to grab the element by it's ID, then read it's innerHTML property:
OnClientClick="return confirm(document.getElementById('<%=lblGVDeleteMessage.ClientID%>').innerHTML)"
But you might want to consider moving the logic out into another function:
Script:
function showConfirm(id) {
var elem = document.getElementById(id);
return confirm(elem.innerHTML);
}
ASPX:
OnClientClick="return showConfirm('<%=lblGVDeleteMessage.ClientID%>')"
You probably want this to be:
"return confirm(document.getElementById('#<%=lblGVDeleteMessage.ClientID%>').innerHTML)"
Based off the comment below and the fact that you must be dynamically setting the text to the label in the first place, can you not just set the text dynamically into the call instead? Bit neater than outputting an extra dom element that will always be hidden, e.g.:
"return confirm('<%# SomeFunctionTosetTheText() %>')"
The only way I made it work was to set ClientIDMode="Static" on the label and on the OnClientClick event do this: "return showConfirm('lblGVDeleteMessage');"

Passing Repeater Container.ItemIndex to a Javascript function

In C# Asp.Net I need to pass my repeater occurrence index into a Javascript function when OnClientClick is depressed from an ASP button. Here is my code
<asp:Button ID="btnGetNewQuote"
Text="Get New Quote"
class="pcbutton"
runat="server"
OnCommand="GetNewQuote"
CommandArgument ='<%# Container.ItemIndex %>'
OnClientClick="return getNewQuote(<%# Container.ItemIndex %>) />
If I hard code ....OnClientClick="return getNewQuote(0)"> it works and the JS gets invoked, but as soon as I put the # Container.ItemIndex # in there the JS gets overlooked and it just posts back to the code behind...
Passing the Container.ItemIndex into JS Functions works every where else on the page except this OnClientClick ?
does anyone know why this is and what I can do to get around it?
Try this
OnClientClick='<%# "return getNewQuote(" + Container.ItemIndex + ")" %>'
Instead of
OnClientClick="return getNewQuote(<%# Container.ItemIndex %>)
If we want to use in vb.net
OnClientClick='<%# "return getNewQuote(" & Container.ItemIndex & ")" %>'
otherwise it will give exception string is not in correct format

Categories