Hidden field value updated but not showing updated value in codebehind? - c#

I am setting the hidden filed value through JavaScript as below
<script lang="JavaScript" type="text/javascript">
function ChangeVal()
{
var elem = document.getElementById("btnDownloadStream");
if (elem.value == "Start")
{
elem.value = "Stop";
document.getElementById('myHiddenInput').value = "1";
}
else
{
document.getElementById('myHiddenInput').value = "0";
elem.value = "Start";
}
}
I am trying to get hidden field value in code behind. My code is
HiddenField myHiddenInput = (HiddenField)Page.FindControl("myHiddenInput");
var val = myHiddenInput.Value;
Before this line I am calling one function which creates and generates the GetResponseStream(). While doing this I am not able to get the value from server controls. Why?

Becuase Changing the value in javascript will not affect the server side value.
if you want to change a server side value from javascript: You can try the following
// Javascript
var myHidden = document.getElementById("<%:myHiddenId.ClientId%>");
myHidden.value = myJSVariable;
Make sure the myHidden is a server control.

Set Runat="server" attribute to your hidden field as shown below :
<input type="hidden" value="" id="myHiddenInput" runat="server" />
Then update your javascript function as shown below :
function ChangeVal() {
var elem = document.getElementById("btnDownloadStream");
if (elem.value == "Start") {
elem.value = "Stop";
document.getElementById('<%=myHiddenInput.ClientID%>').value = "1";
}
else {
document.getElementById('<%=myHiddenInput.ClientID%>').value = "0";
elem.value = "Start";
}
}
now you can directly access your hidden field value in your code behind without using Page.FindControl as mentioned :
var val = this.myHiddenInput.Value;
Update:
One thing I have noticed that your button is server side button and in your javascript you call
var elem = document.getElementById("btnDownloadStream");
I think it should be
var elem = document.getElementById('<%=btnDownloadStream.ClientId%>')
otherwise you will always get the value of else part
Make sure this is not the case.

well #Vishweshwar Kapse is answered your question.
Place your hidden field in update panel and don't forget to add click event of button in trigger.

This also happens in case you use the UpdatePannel in your page. if this is the case then place the HiddenField inside the UpdatePannel and try again.

You forget about ViewState. If you change data in the hidden field using java script code the ViewState do not get this changes and that's why you cannot get the correct value in code behind.

Make sure your hidden field have runat="server" attribute..

Related

How to make textbox visible when previous textbox contains text

I have a WebForm in which i need to place around 30 textboxes mainly to enter barcode scanned data. I am making only the first textbox visible and i want the next textbox to be visible only when the previous textbox is filled with some text. I tried using 'If' condition as well in the textbox on selected change but it doesn't work. Any solutions?
You should use java-script for this because if you will use server side function for this then It will go to server so many times by this your application performance also will decrease.
So create a java-script function that will accept one argument. This argument will take next text box id (text box u want to display).
call this javascript function like this:- onkeyup="calgrid(this,"TextBox2");"
pass nexttextbox id in place of TextBox2...
<script type="text/javascript" language="javascript">
function calgrid(firsttextbox,nexttextbox)
{
var id=firsttextbox.id;
var lastindex= id.lastIndexOf("_");
var strclnt=id.slice(0,lastindex+1);
var txtboxvalue=document.getElementById(firsttextbox).value;
if(txtboxvalue!="")
{
document.getElementById(strclnt+nexttextbox).style.visibility='visible';
}
else
{
document.getElementById(strclnt+nexttextbox).style.display = "none";
}
}
</script>
note:- If you will do visible=false from textbox property then we cannt do visible=true from javascript. So Set style for all textbox style="display:none"
You can resolve your problem by Jquery.
I have make a sample code where i have take four Textbox. Initially only first text box is visible in Web form, when user enter some values in first TextBox next Textbox is automatically display if Previous textbox have a value if not next textbox is not visible.
Sample code is given below :
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
$('input:text:not(:eq(0))').hide()
$('input').on("change paste keyup", function () {
if ($(this).val().length > 0) {
$(this).next().show();
}
else
{
$(this).next().hide();
}
});
I have made sample application for same ,please click on given link for Demo
See Demo application
It's at Client side code so its performance is so fast rather than Server Side.
Please vote me if you feel your problem is resolved by my idea.
I'd name these text boxes similarly like "textbox1", "textbox2", "textbox3" so you can easily find the index of current text box. Then you can use KeyDown event to control what will be shown and what not. This is not a working example but it should give you a good direction.
int currentIndex = 1;
private void TextBox1_KeyDown(object sender, KeyEventArgs e)
{
TextBox t = Controls["TextBox" + (currentIndex + 1).ToString()] as TextBox;
t.Visible = true;
currentIndex +=1;
}
Use can use Keydown event in your first textbox
try this code
initially set flag=1 as first textbox is going to be by default visible
private void visibleTextBox(Control c)
{
int flag = 1;
foreach (Control c1 in c.Controls)
{
if (c1.GetType() == typeof(TextBox))
{
if (flag == 1)
{
((TextBox)c1).Visible = true;
}
else
{
((TextBox)c1).Visible = false;
}
if (((TextBox)c1).Text != "")
{
flag = 1;
}
else
{
flag = 0;
}
}
}
}
Comparatively simple solution in JavaScript. The code should be somehow like this.
Define onchange event on text boxes like this:
<asp:TextBox ID="txt1" runat="server" onchange="show('txt1', 'txt2');"></asp:TextBox>
<asp:TextBox ID="txt2" runat="server" onchange="show('txt2', 'txt3');" Style="visibility: hidden;"></asp:TextBox>
Then use this JavaScript code to show the next TextBox conditionally. Put this code in the head tag of the page:
<script type="text/javascript">
function show(txtCurrent, txtNext) {
var valueCurrent = document.getElementById(txtCurrent).value;
//alert(valueCurrent);
if (valueCurrent.length > 0) {
document.getElementById(txtNext).style.visibility = 'visible';
}
else {
document.getElementById(txtNext).style.visibility = 'hidden';
}
}
</script>

Read hidden control value in asp.net

I am using the a hidden controls in my page and assign value to the hidden control using javascript. Now i want to get the hidden control value in code behind. It always return the null value. Please help me to solve it.
My partial code is here.
<asp:HiddenField ID="Hfproductid" runat="server" />
var hfproductid = document.getElementById('<%= Hfproductid.ClientID %>');
prod_id=100;
hfproductid .innerHTML = prod_id;
In My Code Behind
------------------
string invid = HfInvoices.Value; //invid =""; always
You must set the value of hidden field, not innerHTML.
hfproductid.value = prod_id;
You can directly set value by
if (!Page.IsPostBack)
{
document.getElementById('<%= Hfproductid.ClientID %>').value = "100";
}
Then show the value by
alert(document.getElementById('<%= Hfproductid.ClientID %>').value)
It is beacause your page is posting back.
Thats why on clientside you may get its value through javascript but on serverside, page is posting back.
Try to use IsPostback Property.
if(!Page.IsPostback)
Refer:
http://msdn.microsoft.com/en-us/library/system.web.ui.page.ispostback.aspx
var hdnvalue= document.getElementById('<%= HiddenValue1.ClientID %>');
myvalue=5;
hdnvalue.val(myvalue);alert(hdnvalue.val());
try the following code:
var hfproductid = document.getElementById('<%= Hfproductid.ClientID %>');
prod_id=100;
hfproductid .val(prod_id);
alert(hfproductid .val());
Hope this will work for you
Updated:
Then on post back your page is being refreshed:
Add
if(!IsPostback){
String test = Hdftest.value;
}
Try this
what juanreyesv mentioned earlier is absolutly correct,If you change the value with javascript you have to post back the information to the server, if not you are not going to see the changes in the "code behind"
For that you have to force tha postback event in clientside itself by using
__doPostBack();
So your code will be,
var hfproductid = document.getElementById('<%= Hfproductid.ClientID %>');
var prod_id = 100;
hfproductid.value = prod_id;
__doPostBack();
And then in Page ispostback you will get the desired value
if(IsPostback){
string invid = Hfproductid.Value;
}
The above code will work fine but since it is a forced postback without any condition it will get fired continuously so to avoid that you have to take 1 hidden field and use it as a flag to check if there is any value then dont fire the
_doPostBack()
So your final code should look like
if (document.getElementById('<%= hdncheck.ClientID %>').value == "Y") {
var hfproductid = document.getElementById('<%= Hfproductid.ClientID %>');
var prod_id = 100;
hfproductid.value = prod_id;
document.getElementById('<%= hdncheck.ClientID %>').value = "N";
__doPostBack();
}
In server side
if (!IsPostBack)
{
hdncheck.Value = "Y";
}
if (IsPostBack)
{
string invid = Hfproductid.Value;
}

How can i store the selected tab on a RadTabStrip that can be returned to on back button click

I currently use a hidden input field that is assigned the value of the tab that has just been selected, via javascript, like so:
function onTabSelecting(sender, args) {
var tab = args.get_tab(); //get selected tab
document.getElementById("MainContent_hdnPreviousTab").value = tab.get_text(); //assign value to hidden field
if (tab.get_pageViewID()) { //ignore
tab.set_postBack(false);
}
}
I then use this assigned value when the page is returned to, on client-side (ajax) PageLoad() event:
<script type="text/javascript" language="javascript">
var runOnce = false;
function pageLoad() {
if (!runOnce) {
var lastTab = document.getElementById("<%= hdnPreviousTab.ClientID %>");
if (lastTab.value) {
if (tabStrip) {
var tab = tabStrip.findTabByText(lastTab.value);
if (tab) {
tab.click();
}
}
}
runOnce = true;
}
}
</script>
Currently in IE this works fine (I know right?), the value that was previously set in javascript is still there and i am able to lcoate the tab that the user left the page on. However in FF, Chrome, etc. i have no such luck. The hidden field is returned to it's empty state (value = "") regardless of utilising viewstate or not.
Very curious as to whether anyone has an alternative method that would be appropriate in this situation. Please let me know if this is unclear.
Many thanks.
You could use localstorage.
localStorage.setItem('tab', value);

Saving a value to and reading from the viewstate

I'm not too familiar with .NET, but I want to save a simple value (a number between 1 and 1000, which is the height of a particular div) to the viewstate and retrieve it when the update panel reloads (either in the markup somewhere or with javascript). What is the simplest way to do this?
This page gives me the following code:
string strColor;
if (Page.IsPostBack)
{
// Retrieve and display the property value.
strColor = (string)ViewState["color"];
Response.Write(strColor);
}
else
// Save the property value.
ViewState["color"] = "yellow";
However, I'm not totally clear on where or how to access the example strColor.
Since this is in the code behind, where will Response.Write even spit that code out? I couldn't find it when I tried this code. And how do I use javascript to set that value, instead of setting it in the code behind?
You can simply set the div as a server control as so:
<div id="yourdiv" runat="server" ...
And when the page posts back; simply set it's height by setting its attributes; for example:
yourDiv.Attributes("style","height:"+height_read_from_ViewState+"px;");
Or, you can store the height on the client side, using a Hidden field and reading that hidden field's value on the server side to set the div's height.
<asp:hiddenfield id="hdnHeight" runat="server" />
You set the height in Javascript as so:
function setHeight(value)
{
document.getElementById('<%=hdnHeight.ClientID').value=value;
}
And on post back on server side:
yourDiv.Attributes("style","height:"+hdnHeight.Value+"px;");
I would change strColor to a property and use the viewstate as a backing store for the propery.
public string strColor
{
get
{
return ViewState["strColor"];
}
set
{
ViewState["strColor"] = value;
}
}
And then you would use it like any other property:
if (Page.IsPostBack)
{
// Retrieve and display the property value.
Response.Write(strColor);
}
else
// Save the property value.
strColor = "yellow";

aspx change focus from different TextBoxes on the fly

I am trying to change the focus from one textbox to another while the character count in
on textbox reaches 13 I am using the code below with nothing happening whatsoever:
if (!this.ClientScript.IsClientScriptBlockRegistered("qtyFocus"))
{
this.ClientScript.RegisterClientScriptBlock(this.GetType(), "qtyFocus",
#"<script type='text/javascript' language='javascript'>function qtyFocus(){
var trckNumberLength = document.getElementById('txtTrackingNumber').value.length;
if(trckNumberLength == 13){
document.getElementById('txtQuantity').focus();
}}</script>");
}
txtTrackingNumber.Attributes.Add("onchange", "javascript:return qtyFocus();");
can anyone help please ?
Probably because the line in the script that's doing
var trckNumberLength = document.getElementById('txtTrackingNumber').value.length;
Needs to be changed for:
var trckNumberLength = document.getElementById('"+txtTrackingNumber.ClientID+"').value.length;
The reason being that txtTrackingNumber will very likely have a different Id when it's rendered on the page so you need to use the ClientID property of the control instead of the id you defined on the markup.

Categories