Issue related to getting ClientID of asp controls in Javascript - c#

I have asp.net webApplication having asp controls.
<asp:HiddenField ID="hdTime" runat="server" />
To Access above control in Javascript i have used $('#ContentPlaceHolder1_hdTime').val('AM');
it works fine in Mozila firefox but in InternetExplorer it takes
$('#ctl00_ContentPlaceHolder1_hdTime').val('AM');
i have also tried
$('#<%= hdTime.ClientID %>')
but above syntext works only on .aspx page but when i use javascript.js file it doesn't find as $('#<%= hdTime.ClientID %>')
so how to access asp controls in .js file??
Thanks

You can set Clientidmode="static" for the control..
<asp:HiddenField ID="hdTime" runat="server" Clientidmode="static"/>
Javascript:
//Accessing control in javascript
var abc=document.getelementbyid('hdTime').value;

Try using static client side ids:
http://msdn.microsoft.com/en-us/library/system.web.ui.control.clientidmode(v=vs.110).aspx
This issue is because the ids generated by webforms are dynamic, so you cannot hard code them. However, webforms 4 introduced static client side ids to solve the issue you are having.
For example, add this attribute to your control: ClientIDMode="Static", and then you can reference your control in JavaScript like this:
$('#hdTime')
If you can't use webforms v4 then you will have to put your JavaScript in the aspx page.

You can use like this : <asp:HiddenField ID="hdTime" runat="server" ClientIDMode="Static" />
you can find the ID of the control, also important is to give ClientIDMode="Static"
var id = Document.getElememtById("hdTime").value;
or
var id = $("#hdTime").val();

Related

form.__EVENTTARGET.value undeffined in js

at my webforms.app on .net 4.0 after call _doPostBack via
aspx code
<%= GetPostBackReference() %>;
on code behind
protected string GetPostBackReference()
{
return Page.ClientScript.GetPostBackEventReference(ReloadThePanel,"null");
}
transformed to
__doPostBack('ctl00$cntMain$ReloadThePanel','null');
in form
<!-- update panel -->
<asp:UpdatePanel ID="updPanelSave" ClientIDMode="Static" runat="server">
<ContentTemplate></ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ReloadThePanel" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<!-- hidden button for update panel -->
<asp:LinkButton ID="ReloadThePanel" runat="server" style="display:none;" />
after first ajax postback is all ok, after another one ajax postback on same page it throw js exception
form.__EVENTTARGET.value undeffined
in (Scriptresource.axd ... dynamic code)
_doPostBack: function PageRequestManager$_doPostBack(eventTarget, eventArgument) ....
form.__EVENTTARGET.value = eventTarget;
form.__EVENTARGUMENT.value = eventArgument;
this._onFormSubmit();
what i do wrong ? Its maybee same isue with http://www.hanselman.com/blog/IE10AndIE11AndWindows81AndDoPostBack.aspx
problém is only on ie 11,8 usw.. Chrome and FF works well
Thanx
Easiest thing to do is upgrade to 4.5.1 - it may be that issue you mention and that'd solve it.
Seems strange that it happens AFTER and initial postback though (and doesn't tie in with the issue above).
Personally I don't see much point in creating the postback reference by using a hidden button (and suspect that's where it's getting itself confused). You have blank content template here, but there is probably something contained within in the real code, make sure you don't have any unmatched div tags as that would push the button into the panel and you'd lose reference to it.
I'm guessing that you must be calling the postback from javascript (otherwise why use a hidden button), so why not just use: . You might want to populate the id programatically (in aspx : ', '');"> )
I know it seems nasty including direct references to __dopostback - but the day M$ change that is the day that 90% of webforms websites will go down anyway, so it's pretty unlikely.

How to pass a variable value from the code behind to an external JavaScript file (jQuery file)?

Suppose I have this:
<asp:LinkButton runat="server" CssClass="lFilename" ID="grdlinkFilename" Text='<%#Eval("FILEPATH")%>' CommandArgument='<%#Eval("FILEPATH")%>' OnCommand="grdlinkFilename_click"> </asp:LinkButton>
How can I pass the <%#Eval("FILEPATH")%> to an external JavaScript (jQuery) file?
You can take help of html tage data-id to do this.
<asp:LinkButton runat="server" CssClass="lFilename"
ID="grdlinkFilename" Text='<%#Eval("FILEPATH")%>'
CommandArgument='<%#Eval("FILEPATH")%>'
OnCommand="grdlinkFilename_click" data-id='<%#Eval("FILEPATH")%>' >
</asp:LinkButton>
and in Jquery you can get that value as
var result = $("#grdlinkFilename").attr("data-id");
Is this what it is you need ?
HTML
var valueLink = document.getElementById('grdlinkFilename').innerText
ASP
var valueLink = document.getElementById('<%=grdlinkFilename.ClientID %>').innerText
You can pass it using different state management available in ASP.NET and out of it.
For ASP.NET "specific" state management , can have a look on good description on :
A Beginner's Tutorial on ASP.NET State Management
Or, simply assign value to some UI element with display:none,and read it's value from javascript.

Auto Fill Textbox in ASP.NET depending on the text typed in another textbox

how to fill textbox in asp.net while i am typing in another text
.. changes in one textbox will affect in another textbox auto.. and without refreshing my page.
Ok, try this. You will need the AJAX Control Toolkit. So read the article Installing AJAX Control Toolkit 4 in Visual Studio 2010 to see how to install it in Visual Studio.
Then you need to add a ScriptManager to your ASPX page. You will need to add the following code:
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
What you then need to do, is add an UpdatePanel to your page. Inside this update panel, you need to place the textbox. This means that only the controls inside the update panel will refresh, and not the whole page. To do this, add the following code:
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<!--Add your Textbox Control to update here: Textbox1-->
<asp:TextBox ID="Textbox1" runat="server" ReadOnly="True"></asp:TextBox>
<asp:TextBox ID="Textbox2" runat="server" ReadOnly="True" ontextchanged="Textbox2_TextChanged"></asp:TextBox>
</ContentTemplate>
<Triggers>
<!--This is the textbox you will be typing text into: TextBox2-->
<asp:AsyncPostBackTrigger ControlID="Textbox2" EventName="TextChanged" />
</Triggers>
</asp:UpdatePanel>
The Trigger tells your page which control on the form needs to initiate the postback. Now in your .cs file, you need to add the event handler for the Textbox2 TextChanged event. Add the following code:
protected void Textbox2_TextChanged(object sender, EventArgs e)
{
// Set the text of textbox1 = textbox2
}
I hope that this helps.
No need for AJAX. JQuery is enough. The code will do it
$('#text1').bind('keyup', function(){
$('#text2').val($('#text1').val());
});
Assuming
text1 id of box writing into.
text2 textbox that text gets copied to
in .Net you will have to use client id to get the correct id so it may look like this
$('<%=text1.ClientID%>').bind('keyup', function(){
$('<%=text2.ClientID%>').val($('#text1').val());
});
Oh and wrap it up in $(document).ready as per standard. And of coures you need to include the JQuery library to your page.
No posting back or page refreshes at all. It's your lightest solution and easy to implement.
You will need to use Javascript to accomplish this. ASP.Net code runs on the server side, which means it cannot affect the page without a postback happening first. Read up on the OnTextChanged event and how to hook into it with javascript. There is a javascript library called jQuery which makes everything easier, though it isn't strictly necessary.
Use JQuery. You may need to make an AJAX call to the server if you are relying on a datasource such as a database to autofil this field.

Master and content pages with javascript in asp.net 2.0

Hi i'm very new to .net programming.I want to run a javascript from a content page containing a button. I'm able to display a button but dont know how to bind action. Help me in this regard.
I think it should be easy to Attach a JavaScript function to the control by doing the following:
<asp:Button ID="Button1" runat="server" Text="Button"
OnClientClick="javascript:JSFunctionName();" />
If you have a specific problem then let me know ?

How to call codebehind function without postback with ajax

I have a controller:
<asp:Button OnClick="MyFunction" runat="server" />
I want to be able to call MyFunction without the page reloading. Is this possible with ajax or something? If so how would I do it?
Checkout the ASP.Net instructional videos. Should cover most, if not all, of your questions.
AJAX Videos: The Official Microsoft ASP.NET Site
You have to download Ajax Extensions and install it.
After you do this place instead <asp:Button OnClick="MyFunction" runat="server" /> the following
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Your Text" OnClick="MyFunction" />
</ContentTemplate>
</asp:UpdatePanel>
MyFunction would be a c#/vb function written in your page behind code, not a javascript function. I specified this because i've seen many mistakes that people make regarding this one. OnClick attribute is for c#/vb function and OnClientClick is for javascript function.
For more information regarding how to add ajax functionality to an ASP .NET Page go here
One option is to use page methods.
Add a static method to your page, decorated with the WebMethod attribute:
[WebMethod]
public static void MyMethod(string someParam)
{
}
Enable page methods in your ScriptManager:
<asp:ScriptManager EnablePageMethods="True" ... />
And then you can call it from the client side, using JavaScript (that you can wire to the OnClientClick event of your button):
PageMethods.MyMethod("some value", successCallback, errorCallback);
For more details read the "Calling Static Methods in an ASP.NET Web Page" section on this page:
http://msdn.microsoft.com/en-us/library/bb398998.aspx
Yes you can use Make Client-Side Network Callbacks with Asp.net Ajax using this function you can call your code behind methods without reloading your page. To use this methods you should write your methods as static type.
You can refer this video
http://www.asp.net/ajax/videos/how-do-i-make-client-side-network-callbacks-with-aspnet-ajax
You have one more option using the jQuery Ajax.
The simplest way is to warp your code with an UpdatePanel
There are many examples if you google it.
<asp:Button runat="server" ID="btnShowModal" Text="Show"
OnClick="btnShowModal_Click" />
<asp:Button runat="server" ID="HiddenForModal" style="display: none" />
<ajaxToolKit:ModalPopupExtender ID="Modal1" runat="server"
TargetControlID="HiddenForModal" PopupControlID="PopupPanel" />......it may help u

Categories