Call Server Side function with Keyup Event in Asp.Net - c#

I have a TextBox and I want to capture the Keyup in the Textbox and get the TextBox value at the Code Behind File and Bind The GridView with the Input Received from the TextBox.
I don't want to use Text_Change Event of Asp.net. i want that when ever user enter anything in the TextBox, that value should go to code behind and bind the grid by calling BindGrid Function
<asp:TextBox ID="txtSearch" runat="server"></asp:TextBox>
protected void BindGrid(string searchvalue)
{
// i want the txtSearch value over here.
}

You need to use asp.net ajax. Putting your button and grid in UpdatePanel will update the gridview after binding on button click.
In html
<asp:UpdatePanel runat="server" ID="updatePanel">
<asp:TextBox runat="server" ID="search"
ClientIDMode="Static" OnKeyUp="refreshPanel(this);" />
In javascript
function refreshPanel(textbox) {
alert(this.value)
__doPostBack('<%= updatePanel.UniqueID %>', this.value);
}
In code behind
string parameter = Request["__EVENTARGUMENT"];

Related

OnKeyPress or some type of event that happens as soon as a value has changed in a textbox?

I'm working in C# /ASP.Net and I'm trying to figure out a way to write some code that will run as soon as a textbox's value changes. In Access this would probably be done with a KeyPress event, but I'm using C#. I know nothing about Javascript, and I know there's an OnBlur event for a textbox but it only takes Java.
Is there any way to do this using only C# code-behind and ASP.Net, or am I going to have to suck it up and teach myself Javascript?
What I want to do is determine if any change has been made to a textbox at the moment of the keystroke, and if so I need to change the "Visible" properties of two buttons so that button1 is visible and button2 is not. If no change has been made by the time I get to the OnTextChanged event, then button2 is visible and button1 is not.
There is no way to do this that is native to Asp.Net. You will have to learn a little javascript or jQuery. For example, in native js:
<asp:TextBox runat="server" ID="txt" ClientIDMode="Static" onkeyup="onEnterText()"></asp:TextBox>
<asp:Button runat="server" ID="btnOne" ClientIDMode="Static" Text="One" style="display:none;" />
<asp:Button runat="server" ID="btnTwo" ClientIDMode="Static" Text="Two" />
<script type="text/javascript">
function onEnterText() {
var text = document.getElementById("txt").value,
one = document.getElementById("btnOne"),
two = document.getElementById("btnTwo");
if (text.length > 0) {
one.setAttribute("style", "display:inline;");
two.setAttribute("style", "display:none;");
} else {
one.setAttribute("style", "display:none;");
two.setAttribute("style", "display:inline;");
}
}
</script>
ClientIDMode="Static" is important because it ensures that the control's ID is unchanged (Asp.Net usually creates a client id based on the control hierarchy), enabling you to find the control in javascript.
Also bear in mind that your buttons' visibility will need to be managed during postbacks to mirror the client-side logic.

How to make an html element contain text when an ASP:Button is pressed?

I've got a DIV which contains some text in it.
Ive also got an asp:Button, which when pressed I would like to retrieve this text. However, it appears that as soon as I press the button, the DIV's contents is reset - most likely due to postback.
The DIV has got runat=server". Does anyone have any idea as to what may be done to make this DIV retain its contents on pressing the button? The data is manipulated countless times before the button is pressed, so I would like to try avoiding updating a Session every time.
Try something like this:
getText = function(){
alert($("#<%=Panel1.ClientID%>").text());
return false;
}
<asp:Panel ID="Panel1" runat="server">
</asp:Panel>
<asp:Button ID="Button1" runat="server" OnClientClick="return getText();" ... />
You can also try this:
$("#<%=Button1.ClientID%>").click(function(){
alert($("#div1").text());
return false;
});
One way would be grabbing button click event in your makrkup, store your DIV content in a hidden field, then fire postback manually in your button click.
Try using an asp:Panel. It renders as a DIV and you have access to all of its properties at all points in the page life cycle.
another way is to use Ajax. specifically - updatepanel control
You can store you DIV content in a hidden field by calling a JavaScript function in onClientClick event of the button - it will execute just before OnClick event, before postback. This way, there's no need to fire postback manually.
Let's say you have one div, one hidden field and button with onClientClick and OnClick events. You use simple JavaScript function for the job:
<div id="myDiv" runat="server" ></div>
<asp:Button ID="btnGetDiv" runat="server" Text="Get div value" OnClick="getValueOnServer" OnClientClick="setHiddenFieldF()"/>
<asp:HiddenField ID="hf" runat="server" />
<script type="text/javascript">
function setHiddenFieldF() {
var nevValue = document.getElementById('<%= myDiv.ClientID %>').innerHTML;
document.getElementById('<%= hf.ClientID %>').value = nevValue;
}
</script>
Then, on the server, just use the value of the hidden field.
You can't read your DIV's content because it is not send to the server in the postback. Only values of form elements (<input>, <textarea>, <select>, etc.) are send.
If you really want to read DIV's content, you can copy it to the hidden input (as wrote Kavousi).
Just add hidden field to your page:
<asp:HiddenField ID="hidden" runat="server" />
And then in code behind:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
Page.Form.Attributes["onsubmit"] = string.Format(#"$(""#{0}"").val($(""#{1}"").html());", hidden.ClientID, div.ClientID);
}
}
(div is your div's name).
You can then read div's content by reading hidden.Value.

How to set Slider control Value from ASP.NET AJAX Control Toolkit with JavaScript function?

How to set Slider control Value from ASP.NET AJAX Control Toolkit with JavaScript function?
Is this even possible?
Sure is! You have to set the value of asp:TextBox control that's associated with your SliderExtender to the value that you want. So for this ASP markup:
<asp:TextBox ID="sliderBox" runat="server" ClientIDMode="Static"></asp:TextBox>
<asp:SliderExtender ID="sliderBox_SliderExtender" runat="server" Enabled="True"
Maximum="100" Minimum="0" TargetControlID="sliderBox">
</asp:SliderExtender>
<asp:Button ID="incButton" runat="server" Text="incrementSlider"
onclientclick="change();" />
Which is basically:
an asp:TextBox named sliderBox (for the SliderExtender to use)
an asp:SliderExtender sliderBox_SliderExtender (with basically
default values)
an asp:Button named incButton. This has an onClientClick property that calls the change() javascript function
And here is the change() function:
<script type="text/javascript">
function change() {
document.getElementById("sliderBox").value += 10;
}
</script>
The change() function increments the value in the asp:TextBox control by 10, thus increasing the sliders position each time you click the button.

Bind the asp control while typing the text in Text box

I have a text box and a repeater control. I need to bind the data to repeater control when a user is entering the text in text box. This should happen without clicking on the enter key or mouse click.
Repeater should be binded with the names starts with the given string in the text box
anybody have an idea?
I am assuming that what you want is to enter the same value from the textbox on to a repeater column.
You can use the onchange event of the textbox to call javascript and update your repeater.
ASPX
<asp:ScriptManager ID="ScriptManager1" runat="server" /> <div id="Container"> <asp:UpdatePanel runat="server" ID="UpdatePanel1"
OnLoad="UpdatePanel1_Load"> <ContentTemplate>
<asp:Repeater runat="server" ID="rpt"></asp:Repeater> </ContentTemplate> </asp:UpdatePanel>
<input type="text" id="Container" onkeyup='update(document.getElementById("Container").value)'>
JS
function update(args)
{
__doPostBack('UpdatePanel1', args);
}
C#
protected void UpdatePanel1_Load(object sender, EventArgs e)
{
//bind reapeter
}
Got it.. This http://www.dotnettutorials.com/tutorials/ajax/ajax-search-csharp.aspx helps me to get what exactly I want with minor changes.

updatepanel problem or possible bug

I have TextBox (multiline) and Label in an UpdatePanel which I refresh with javascript __doPostBack(upEditReminder,id);
Then I set both Label and TextBox text to current DateTime.
protected void upReminder_Onload(object sender, EventArgs e)
{
lbTest.Text = DateTime.Now.ToString();
tbReminder.Text = DateTime.Now.ToString();
Problem is that Label is updated but TextBox date is updated only once when the page is loaded but not when __doPostBack(upEditReminder,id); is triggered.
I cant figure out what the problem is.
I have also tried textarea runat="server" but still have the same problem.
Your help is much appreciated.
This worked for me... is it different from what you're doing?
aspx code snippet:
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" OnLoad="UpdatePanel">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
<asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine"></asp:TextBox>
</ContentTemplate>
</asp:UpdatePanel>
Update
codebehind snippet:
protected void UpdatePanel(object sender, EventArgs e)
{
Label1.Text = DateTime.Now.ToString();
TextBox1.Text = DateTime.Now.ToString();
}
Clicking the "Update" link triggers the UpdatePanel's postback which refreshes it via ajax and both the label and textarea get the updated timestamp.
Could you try it after setting EnableViewState as false in that textbox?
Are you setting the textbox text anywhere else in your code behind? I'm guessing it's getting overwritten somewhere...
Add a button inside the UpdatePanel. Click the button, does it update both label and textbox?
In addition, the call you are making should have the ClientID of the updatepanel which looks something like this:
__doPostBack("ctrl00_ctrl01_upEditReminder",'');
From one of your comments I noticed that you are trying to update a textbox outside of the updatepanel. The problem here is that you cannot update something outside the updatepanel in the updatepanel's postback. That's one of the drawbacks of using an updatepanel.
If you still want to use an updatepanel, I suggest that you update the other page's elements using javascript and preferrable jQuery after the updatepanel reload. You could use a hidden input field inside the updatepanel to transfer the data. To refresh the textbox after the update, you could use this JavaScript/jQuery code:
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function () {
var reminder = $("[id$='hidReminder']").val();
$("[id$='tbReminder']").val(reminder);
});

Categories

Resources