How to get hidden field value code behind updated by jquery/javascript - c#

I have an <asp:menu/> control and a hidden field.Now i am using jQuery to change value of hidden field.
Code is:-
$(function() {
$(".primaryStaticMenu tr,td").each(function(index) {
$(this).click(function() {
if ($(this).attr("title") != "undefined"
&& $(this).attr("title").length > 0) {
document.getElementById('ctl00_Hidden_Master_Location').value = $(this).attr("title");
alert(document.getElementById('ctl00_Hidden_Master_Location').value);
//return false;
}
});
});
});
Server side code to get updated value is:-
string Get_cng_value = Hidden_Master_Location.Value;
But Hidden_Master_Location.Value shows null every time.
can any one tell me how to get updated value of hidden field from code behind.

Let say your hidden field is as..
<asp:HiddenField ID="Hidden_Master_Location" runat="server" />
you can get the value of hidden filed in jquery as
var locationValue= $("#<%= Hidden_Master_Location.ClientID %>").val();

Do this, it works for me.the trick is to save your hidden field precious id in another hidden input field then build it back using that hidden value.
Markup
<asp:HiddenField ID="HiddenFieldMaster" runat="server" />
<input type="hidden" id="inputHidden" value='<%= HiddenFieldMaster.ClientID%>' />
Javascript
$(function() {
$(".primaryStaticMenu tr,td").each(function(index) {
$(this).click(function() {
if ($(this).attr("title") != "undefined"
&& $(this).attr("title").length > 0) {
var inputHidden = document.getElementById('inputHidden');
$("#" + inputHidden.value).val($(this).attr("title"));
alert(inputHidden.value);
//return false;
}
});
});
});
Code Behind
String Get_cng_value = HiddenFieldMaster.Value;

Related

Access jquery variable from the code behind

This is my html:
<input type="hidden" id="HiddenIndex" name="HiddenIndex" runat="server" />
Some labels and textbox
<asp:Button runat="server" ID="btnGetCoordinates"
Text="Get Coordinates" OnClick="btnGetCoordinates_Click" />
<asp:Label ID="info" runat="server" Text="Waiting...." />
So when the button Get Coordinates is clicked, it will call the Web Services to return some json results from code behind. A Dialog will popup a listbox with these results. It works perfectly until this point. My goal is when a client select an item in the list and click on "Select" button, it will return the selected item's Index, store in a hidden field and manipulate later from the code behind.
This is my jquery function
function ShowPopup()
{
$("#parentForm").fadeTo(500, .2);
$("#C1Dialog1").dialog({
open: function () {
$(".ui-dialog-titlebar-close").hide();
},
buttons: [{
text: "Select",
click: function () {
var value = " ";
storedIndex = " ";
var selected = $("[id*=lstCandidates] option:selected");
selected.each(function () {
value = $(this).val();
storedIndex = $(this).index();
$("#HiddenIndex").val(storedIndex);
});
alert(value + " and index is " + storedIndex); //Show value and index
alert("html hidden value " + $("#HiddenIndex").val()); //show value
$(this).dialog("close");
$("#parentForm").fadeTo(500, 1);
},
style: "margin-right: 40px;"
},
{
text: "Cancel",
click: function () {
$(this).dialog("close");
$("#parentForm").fadeTo(500, 1);
},
style: "margin-left:0px;"
}]
});
}
</script>
As you can see the alert show the value of the hidden field
This is my code behind
protected void btnGetCoordinates_Click(object sender, EventArgs e)
{
//Show the Dialog
if (count > 0)
{
ClientScript.RegisterStartupScript(this.GetType(), "Popup", "ShowPopup();", true);
//never stop here --PROBLEM RIGHT HERE**, there is NO value for Hidden field**
var indexValue = Request.Form["HiddenIndex"];
info.Text = "HiddenIndex is " + indexValue;
}
}
The Info label show nothing when I click on Dialog's select button
Any help would be appreciated , thank you very much.
Probably an issue with the client ID. ASP.NET will not necessarily use the client ID in your markup when emitting the HTML.
There are several ways to fix this, but the easiest is to make the hidden field a plain HTML control. That way ASP.NET won't monkey with it. So change this
<input type="hidden" id="HiddenIndex" name="HiddenIndex" runat="server" />
to this
<input type="hidden" id="HiddenIndex" name="HiddenIndex"/>
Other options:
Set your clientIDmode to static
Modify your jquery selector to use id$='HiddenIndex' so that it ignores any prefix added by ASP.NET.

Issue with setting hidden field in asp.net winforms using jquery

I have some code to set the value of a hidden field so I can access it in the code behind but the value is always empty in the code behind. The value for the effectiveDate is being set but I doesn't look like the hidden field property Value is being set.
<input id="appEffectiveDate" type="text" />
<label id="effectiveDateLabel" for="appEffectiveDate">App Effective Date</label>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<asp:HiddenField ID="appEffectiveDateToSetForUserRole" runat="server" Value="" Visible="false" />
<script>
$(function () {
var SelectedDates = {};
$('#appEffectiveDate').datepicker({
beforeShowDay: function (date) {
var Highlight = SelectedDates[date];
if (Highlight) {
return [true, "Highlighted", Highlight];
}
else {
return [true, '', ''];
}
}
});
$("#effectiveDateLabel").hide();
$("#appEffectiveDate").hide();
$('input[value="85"]').click(function () {
if($(this).is(':checked'))
{
$("#effectiveDateLabel").show();
$("#appEffectiveDate").show();
}
});
$("#appEffectiveDate").change(function () {
var effectiveDate = $("#appEffectiveDate").val();
$(":asp(appEffectiveDateToSetForUserRole)").prop('value', effectiveDate);
});
});
</script>
In the code behind the value is empty for the hidden field:
if (!string.IsNullOrEmpty(appEffectiveDateToSetForUserRole.Value))
{
// this is never called because .Value is empty
}
If Visible is set to false, the control will not be rendered by ASP.NET in the markup at all, which means that jQuery won't be able to find it because it doesn't exist. Just remove the visible=false part. It'll stay hidden.

Hidden field value updated but not showing updated value in codebehind?

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..

How to get a variable value from aspx(jquery) to its codebehind?

I have a jQuery variable like
Default.aspx:
$(function () {
$("#divimgbtnGo").click(function () {
var ServiceNo = $(".ddlService option:selected").val();
});
});
Here I am getting value into ServiceNo. I want to use these value in my codebehind (Default.aspx.cs).
Can anyone please help?
All information in search is about getting codebehind to aspx. SO could not found any useful result and stuck here
Have a hidden feild in your aspx page then pass your variable value to that hidden field like this
$(function () {
$("#divimgbtnGo").click(function () {
$("#<%= yourhiddenfield.ClientID %>").val($(".ddlService option:selected").val());
});
});
In your Code behind get the value of hidden field as yourhiddenfield.Value
You can use, for example, a Hidden field, so ASP.NET will take care of transfering that data to the server and mapping it to CLR datatype after.
You can take hidden field and set ServiceNo value to hiddenField and u can use hiddenfield in server side.
add hidden field in Default.aspx page
<asp:HiddenField ID="hdnServiceNo" runat="server" />
set hidden field value.
$(function () {
$("#divimgbtnGo").click(function () {
var ServiceNo = $(".ddlService option:selected").val();
$('#hdnServiceNo').val(ServiceNo );
});
});

inline edit control

The label is initialized with the value of the textbox. Upon clicking the label, the textbox is shown. The user can then edit the contents of the textbox. Upon blurring focus, the textbox is hidden and the label shown. Should the user delete the contents of the textbox or only enter whitespace into the textbox, the textbox is not hidden, thus avoiding showing a label with no text. Is there a way to do this ?
Untested, but the general idea should help you out.
HTML:
<asp:TextBox ID="txtA" onblur="txtBlur();" style="display:none;" runat="server"/>
<asp:Label ID="txtA" onclick="txtFocus();" runat="server"/>
Client-side JS:
<script>
var txtA = document.getElementById("<%# txtA.ClientID %>");
var lblA = document.getElementById("<%# lblA.ClientID %>");
function txtBlur()
{
if (txtA.value.trim() != '')
{
lblA.innerText = txtA.value;
lblA.style.display = 'inline';
txtA.style.display = 'none';
}
}
function txtFocus()
{
txtA.value = lblA.innerText;
lblA.style.display = 'none';
txtA.style.display = 'inline';
}
</script>
Check for js validation that textbox is not empty
function Validate()
{
if(document.getElementById("txta").value=="")
{
alert('Please enter the value');
document.getElementById("txta").focus();
return false;
}
}
or you can server side
if (txa.text ="")
{
Response.Write('Text box cannot be empty');
}

Categories