How to read text box text set by JavaScript from code behind? - javascript

I have one ASP.net text box on my page. I am setting text property of this text box using JavaScript. Now, I want to access this text value from back-end (using C#). However, whenever I try to access it, I am getting the old value (the one set up during page load) and I am not able to get the value set by JavaScript code.
Am I missing something here?
ASPX markup of the text box -
<asp:TextBox ID="txtMessage" runat="server"></asp:TextBox>
JavaScript to edit this text box -
var txtMessage = document.getElementById("txtMessage");
txtMessage.Value = "New Value";
C# code to access text box text -
string strMessage = txtMessage.Text; // This does not return value set by above JS function

You just have to change this line in the JavaScript:
txtMessage.value = "New Value"; // the "v" in ".value" needs to be lowercase
UPDATE: I set up an ASP.NET page to make sure that the OP's code did in fact work with that one change, just to make sure I wasn't missing any other little typo. However, as Igor pointed out in his comment, it's a good practice to use the control's ClientID property to account for any prefixes that the .NET runtime might add to an HTML element's id.
So the two lines in your JavaScript should be changed to this (also confirmed to work correctly):
var txtMessage = document.getElementById("<%= txtMessage.ClientID %>");
txtMessage.value = "New Value";

When ASP.Net delivers the page to be render, the name of the controls are changed by prepending a suffix that identifies the container that hold them. From JavaScript, you must ensure to get the correct ID of ASP controls by accessing the .ClientID property.
//gets the element by its ID according to ASP rules
var txtMessage = document.getElementById("<%=txtMessage.ClientID%>");
//the "value" property is lowercase
txtMessage.value = "New Value";

Related

access local storge with javascript and C#, asp.net

i am hoping someone will help me, i am pulling out my hair for the last few hours...!
I am using asp.net web forms with c#
I have the following button in my menu , this button opens up a page that lists selected properties for realtor…
htmlCode.Append("<button type='button' class='btn btn-basic' id='btnEnquire' onclick='openEnquiryPage()'> <span class='glyphicon glyphicon-th-list'></span> View my list </button>");
function openEnquiryPage() {
location.href = "EnquiryPage.aspx";
//get the list from the storage into the hidden field
//getListOfProperties();//not in use...
}
The list is stored in localstorage as Json, I can see the correct data in the text box on the page
var retrievedData = localStorage.getItem("propertyArray");
proplist2.value = retrievedData;
declared as follows in asp.net control
<asp:TextBox ID="TextBox1" runat="server" Text="initial"></asp:TextBox>
BUT in the hidden field, the data is always = ""
<asp:HiddenField ID="txtPropList" runat="server"></asp:HiddenField>
javascript to populate the hidden field...
function getListOfProperties() {
document.getElementById("body_content_txtPropList").value = retrievedData;
var proplist2 = document.getElementById("body_content_txtPropertyList");
proplist2.value = retrievedData;
}
when I debug the following lines in the code behind ...
Page.ClientScript.RegisterStartupScript(this.GetType(),"prop", "getListOfProperties();",true);
_propertyListJson = txtPropList.Value;
propertyListJson I always = “”
Thank-you in advance.!
If you want to use the hidden field then you should use
<%=txtPropList.ClientID%>
as on when you render the page and see it in inspect element server would render the different Id so it would not store the value in hidden field simply so it is feasible to use ClientID to create the static mode. But as on when you call the javascript function from the c# code then it would call the javascript function but it would not wait for it and execute the next line of code as on at that time the value is not store in hidden field so it would return the null value.
If you want then call the function of javascript on page load event and then click the button and retrieve the value it would successfully retrieve the value but i dont think that these would be the feasible code from my opinion
I suggest to create the WebAPI which would simply get the the data from the localstorage and perform the operation
And webAPI can be easily called from javascript using ajax call
I hope this would be helpful and answer is satisfactory 😊☺
Thank You ☺🙂

Unable to get value of input using ASP.NET

I'm trying to return some text which was inputted into a textbox element on my website. After entering some text into it I noticed that this didn't return data:
document.getElementById('myTextBox').text;
But this did:
document.getElementById('myTextBox').value;
EDIT: The javascript above was used client side to test what was being read, using .text returns an empty string which, when passed back to the server, did indeed show an empty string. .value contained my entered data but when I tried using .value server side the errors occurred.
However in my .cs class when I tried to add the following:
string myInput = myTextBox.Value;
I get an error message saying
"System.Web.UI.WebControls.TextBox doesn't contain a definition for
'Value'...".
The example I was referencing came from here: http://www.aspsnippets.com/Articles/Get-value-of-HTML-Input-TextBox-in-ASPNet-code-behind-using-C-and-VBNet.aspx
My textbox is declared like:
<asp:TextBox ID="myTextBox" runat="server"></asp:TextBox>
However when I try to change the TextBox element to an Input element I get an error saying "The type or namespace name 'Input' does not exist..."
How can I pass the data which was entered into my TextBox back to the server?
In the tutorial you are refering they have demonstared how to access the html input textbox value at server side. You are mixing a html control and a asp.net server control.
This represents a ASP.NET server control:-
<asp:TextBox ID="myTextBox" runat="server"></asp:TextBox>
and you can access its value at server side (.cs file) like this:-
string vaue = myTextBox.Text;
On the other hand the html input can be converted into a server control by adding the runat="server" attribute like this:-
<input type="text" id="txtName" name="Name" value="" />
In this case it is HtmlInputText and you need to access it value like this:-
string value = txtName.Value;
HTML elements e.g (input) are not accessible in your code behind. Asp.Net controls like the one you used can be accessed if you use the runat="server" attribute.
If you want to access yout Asp.Net textbox in your codebehind (.cs) you don't need javascript. Just use:
string value = this.myTextBox.Text
But, if you textbox is only a HTML input, than, you need to use some Javascript logic to get the value of the input and pass it to your .cs file.
For that, you have to do something like this:
Passing values from javascript to code behind in ASP.NET
Use:
string myInput = myTextBox.Text;
This give you all the text typed in the textbox
To get the text of your textbox for a javascript function :
function GetValueOfmyTextBox()
{
var myTB = document.getElementById('<%= myTextBox.ClientID %>');
alert(myTB.value);
}

Collecting text box values in Visual Basic

I have some Javascript code that assigns a value to a text box:
document.getElementById('longitudeTextBox').value = location.coords.longitude;
What I want to do is get the value of that text box over to Visual Basic:
Dim Logitude As String = longitudeTextBox.Text
This works if the code is inside a button, but if I use it on a page event like Page_Load, I'm not receiving any data.
Try using it when pageload.complete = true

How to get value of dynamically created textbox web control in asp.net

My aspx page contains list of products along with dynamically generated textboxes and one order button with each product.
Textboxes and buttons are generated at runtime with ids like txt110234,txt110235...so on for textboxes and btn110234,btn110235...so on for buttons.
Each time user have to enter quantity in the textbox and press order button associated with any product to place any order.
Every thing is working fine but now i want to do it using ajax,so i need to get the value entered by user in text box.I want to do something like this-
var quan = document.getElementById('<%= txt' + id + '.ClientID%>').value;
But its giving me the following error.
Compiler Error Message: CS1012: Too many characters in character literal Source Error:
How can i get the value of textbox?Any suggestion will be appreciated..
The error you got is because you can't involve javascript inside the "<%= .. %>" block. Also this doesn't look possible since the "<%= .. %>" expression is evaluated in server before the page is rendered, but your "id" is a client side variable.
You can set the script in server side like that:
client side code:
function foo(ctlID)
{
var quan = document.getElementById(ctlID).value;
}
server side code:
TextBox txt = new TextBox();
txt.ID = "SomeID";
Form.Controls.Add(txt);
Button btn = new Button();
btn.ID = "someID";
btn.OnClientClick = "foo('" + txt.ClientID + "')";
Suggestion:
One way of doing this is to use jQuery css selector. You can assign a particular cssclass to all your input textbox and retrieve all of them via jQuery selector.
For example, on generating textboxes dynamically, you can assign them CssClass =".productQuantity"
and then later use jQuery selector something like $('.productQuantity')
I personally prefer this approach If I would like to traverse to multiple elements. This saves me from dealing with Ids etc.

Javascript to get sharepoint form field value to a variable

I want to copy the content of a sharepoint form field to a variable using Javascript.
Eg. I have a field named "Language" in my sharepoint edit form. Now I just want to get the value of that field to a varaible x.
Please help.
BR
It depends on the type (e.g. user, lookup, multilookup, text, note, etc.) of field. I am using jQuery in my custom list forms and the name of the field for any given content type will be added to the id of the corresponding html control with the text 'Field' appended to it. However, like any typical asp.net control, the id of the html form control rendered to the client will reflect its control hierarchy so you have to account for that when searching for a field. anyhow, the following works for me if i need to reference fields in my custom forms. ** notice the +Field which implies that the name of the field is concatenated with 'Field'
var $titleField = $('input[id*=TitleField]');
var $lookupField = $('select[id*=Name_Of_Field+Field]')
var $multiLookUpCandidate = $('select[id*=Name_Of_Field+Field][id*=SelectCandidate]')
var $multiLookUpResult = $('select[id*=Name_Of_Field+Field][id*=SelectResult]')
var $note = $('textarea[id*=Name_Of_Field+Field]');
You can pick up on the trend by viewing source and seaching for your contenttype/sitecolumn field name. You will find it in an html form control id. use that information to learn how to reference other field types.
Without posting your code its very difficult to understand what you want to do.... to get a value from a form you can do the following :
HTML
<form id="myform">
<input id="myinput" type="text" value="something" />
</form>
JavaScript:
var myinputval = document.getElementById("myinput").value;
myinputval would be "something" in this example
Demo : http://jsfiddle.net/Qk6FZ/
This might help:
http://depressedpress.com/2012/09/24/obtaining-a-javascript-reference-to-a-sharepoint-field/
Using that function you'd get the reference using something like:
var LanguageFld = getFieldRef("Language");
Once you have the refernece it's easy to get the value:
var CurValue = LanguageFld.value;
Hope this helps!

Categories