I am using JQuery for autocompleting the search textbox with my database. The problem rises when I want to access the text of the search textbox in query string since I am using html textbox. To make it in context, either I have to use runat="server" or I can use asp:Textbox but in both the cases my autocompleting feature stops working.
Here is the aspx code:
<div id="search-location-wrapper">
<input type="text" id="txtSearch" class="autosuggest" />
<div id="search-submit-container">
<asp:Button ID="btnSearch" runat="server" Text="Search"
onclick="btnSearch_Click"></asp:Button>
</div>
</div>
C# Code:
protected void btnSearch_Click(object sender, EventArgs e)
{
string location = txtSearch.ToString(); /*Here is the error: txtSearch is not in current context */
int id = Convert.ToInt32(ddlCategory.SelectedValue);
string url = "SearchResults.aspx?Id="+id+"&location="+location;
Response.Redirect(url);
}
Your problem is likely just that ASP.NET is changing the ID of your textbox when you put the runat="server" on it. Your jQuery probably has something like:
$("#txtSearch")
Instead, add the runat="server" to your textbox and then change it to:
$("#<%= txtSearch.ClientID %>")
When the page renders, it will put the correct ID in for the textbox.
you can use asp:Textbox without stoping jquery:
ASP:
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
jQuery selector :
$("#TextBox1")
if you have a masterpage or a gridview you can get your element client id by using Inspect Element in your browser..
ASP:
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</asp:Content>
jQuery selector :
$("#ContentPlaceHolder1_TextBox1")
Related
I am trying to get html textbox value when click on html button without using "runat" attribute.I need to do it in code behind ,is it possible?
<button id="button1" onclick="btnclick">Click Here</button><input type="text" id="txtBox1" name="txtBox12" />
and My code Behind is like:
protected void btnclick(object sender, EventArgs e)
{
string name = Request.Form["txtBox12"];
Response.Write(name);
}
MODIFIED
To access any control in code behind it needs to have runat=server attribute attached to it.
In your case, like you pointed you can transfer the value of input text to asp hidden field and then access
its value on button click in server-side but in this case too you have to place hidden field inside form runat=server tag.
<form id="form1" runat="server">
<input type="text" id="txt" onkeyup="PassValue(this);";/>
<asp:HiddenField ID="hf" runat="server" />
<asp:Button ID="Button1" runat="server" Text="Go" onclick="Button1_Click" />
</form>
-----------------------
<script type="text/javascript">
function PassValue(obj) {
document.getElementById("hf").value = obj.value;
}
</script>
I am using Visual Studio 2015 to create a ASP.NET web site. I have a DIV that is hidden by default and I am trying to display it if the user checks a check box. I am wondering if there is a way using C# to immediately display the DIV as soon as the user checks the box. I can't seem to find a way to recognize the change in state without the form being first submitted. I can easily achieve this using JavaScript however this is for a uni assignment and requires functionality to be implemented in C#.
This is the HTML for the checkBox:
<form id="form1" runat="server">
Limit Stations To My Location<asp:CheckBox ID="limitOptions" runat="server" onClick="toggleOptions()" />
<br /><br />
<div id="locationOptions" runat="server" hidden="hidden">
Radius (KM)<asp:TextBox ID="radius" runat="server" Text="100"></asp:TextBox>
<asp:Button ID="updateList" runat="server" Text="Button" OnClick="updateList_Click"/>
</div>
Any help would be greatly appreciated.
You can do this with C# in code behind. Add a OnCheckedChanged event to the CheckBox and set the AutoPostBack to true and handle the change. Note that a Panel becomes a div in HTML.
<asp:CheckBox ID="limitOptions" runat="server" OnCheckedChanged="limitOptions_CheckedChanged" AutoPostBack="true" />
<asp:Panel ID="locationOptions" runat="server" Visible="false">
Radius (KM) <asp:TextBox ID="radius" runat="server" Text="100"></asp:TextBox>
</asp:Panel>
However this causes a PostBack, so just using JavaScript could be a better option.
<asp:CheckBox ID="limitOptions" runat="server" onclick="toggleOptions()" />
<div id="locationOptions" runat="server" style="display: none">
Radius (KM)<asp:TextBox ID="radius" runat="server" Text="100"></asp:TextBox>
</div>
<script type="text/javascript">
function toggleOptions() {
var id = '#<% =locationOptions.ClientID %>';
if ($(id).css('display') == 'none') {
$(id).slideDown('fast', function () { });
} else {
$(id).slideUp('fast', function () { });
}
}
</script>
I have an asp:textbox
<asp:textbox ID="NewName" runat="server" />
and when a user clicks the "Cancel" button, I want to erase whatever is in that text box by making the value just be "". If it were a an input field of type text, I could just do this in javascript:
document.getElementById('NewName').value= "";
But I can't just do this because it is an asp:textbox.
When your asp:textbox is rendered to the UI, then yes, it is just an input field of type text. The only part that may be an issue is the ID, but that can be set using ClientIDMode:
<asp:textbox ID="NewName" runat="server" ClientIDMode="Static" />
renders to:
<input type="text" id="NewName" />
and thus the JavaScript you use should work perfectly.
<asp:TextBox> renders to an <input type="text"> which you can use as you would, the only complication is the id="" attribute is rewritten, but you can do this:
document.getElementById("<%= NewName.ClientID %>").value = "";
Assuming that this script is in the same page as the textbox. If this is in a referenced <script src=""> then you'll need to use a global script variable of the element's ID.
Try setting the textbox's ClientIDMode to Static
That way the javascript should be able to find them with the same ID as in ASPX.
Here a whole test page
<%# Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeFile="Default.aspx.cs" Inherits="_Default" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<script type="text/javascript">
function ClearTB1() {
document.getElementById("TextBox1").value="";
}
</script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<p>
<asp:TextBox ID="TextBox1" runat="server" Text="test" ClientIDMode="Static"></asp:TextBox><br />
<asp:TextBox ID="TextBox2" runat="server" Text="test" ClientIDMode="Static"></asp:TextBox><br>
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="ClearTB1()"
CausesValidation="False" UseSubmitBehavior="False" /><br />
</p>
</asp:Content>
I had the same problem. I solved it once I remembered there is a mangling going on with asp.net on the Ids.
within my aspx, i had:
<input type="text" id="sessSubs"/>
further down, within a gridview (hence the use of "class" instead of "id"), i had a column which had an asp:TextBox:
<asp:TextBox runat="server" class="paid" />
once i recalled the id mangling issue, it was just a case of changing the way i referenced the textbox:
<script type="text/javascript">
$(document).ready(function() {
function updateSubs()
{
var sub = parseFloat($('[id$=sessSubs]').val());
$('.paid').val(sub);
}
$(document).on('change, keyup', '[id$=sessSubs]', updateSubs);
});
</script>
Is there a way to Eval the ViewState value on a server control tag?
<asp:TextBox Text='<%#Eval(Viewstate["key"])%>' runat='server' />
Thanks.
Just add a watch for that ViewState value, or set a breakpoint and use the Immediate Window.
edit Changed answer to better suit your requirement to set visibility on a control.
Sticking a databind() in the code behind after setting the Viewstate value will work. e.g.
aspx.cs : -
protected void Page_Load(object sender, EventArgs e)
{
ViewState["Test"] = "hello";
DataBind();
}
aspx : -
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="txtHello" runat="server" visible='<%# ViewState["Test"].ToString() == "hello" %>' Text="Show Hello"></asp:TextBox>
</div>
</form>
</body>
will "show hello" but if you change the viewstate value to something else it won't.
You can do it like this:
<asp:Label runat="server" Text='<%# ViewState["key"] %>'/>
The <%# %> annotation means whatever is within provides access to codebehind. In this case, it will access ViewState and retrieve the item saved under "key". As a result, the #Text of the label will be whatever the value of ViewState["key"] is.
I have a repeater control in which i have loaded questions. I want to display a textbox and a button when some one click the question and answer that question with out posting back the page. the textbox and button get hide when the user post the answer
U could do this with ajax using an UpdatePanel.
The javascript will be generated for you by the ASP.NET engine.
You can learn more on the UpdatePanel here.
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<span onclick="ShowTextBox(<%# Container.ItemIndex %>)"><%# Eval("Question") %> </span>
<div style="display:none" id='<%# "dv_"+Container.ItemIndex %>'>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<asp:Button ID="Button2" runat="server" Text="Button" />
</div>
</ItemTemplate>
</asp:Repeater>
AND Add some script
`<script type="text/javascript">
function ShowTextBox(index) {
$("#dv_" + index).show();
}
</script>`
Remember you should include the jquery file in the head.
download from jquery.com