I have a telerik radcalandar control, it currently makes a post back which is fine but I want it to have a client function call too for getting onclientclick on selection changed.
I have tried with the below code snippet but not able to reproduce this issue.
JS
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script>
function DateSelected(sender, args) {
alert(args.get_renderDay()._date);
}
</script>
ASPX
<telerik:RadCalendar ID="RadCalendar1" runat="server" AutoPostBack="true" OnSelectionChanged="RadCalendar1_SelectionChanged">
<ClientEvents OnDateSelected="DateSelected" />
</telerik:RadCalendar>
<asp:Label ID="Label1" runat="server"></asp:Label>
ASPX.CS
protected void RadCalendar1_SelectionChanged(object sender, Telerik.Web.UI.Calendar.SelectedDatesEventArgs e)
{
Label1.Text = e.SelectedDates[e.SelectedDates.Count - 1].Date.ToString();
}
Related
At the moment I have no luck trying to get the three of them to work together and i have had only luck with the updatepanel and update progress nothing the confirm button so far.
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="btnEnter" runat="server" Text="Update" Width="180" Style="margin-left:157px;"
OnClick="btnEnter_Click"
CssClass="button-success pure-button"/>
<asp:ConfirmButtonExtender ID="ConfirmButtonExtender1" runat="server"
TargetControlID="btnEnter"
ConfirmText="Do you want to see submit?"
ConfirmOnFormSubmit="false">
</asp:ConfirmButtonExtender>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<div class="overlay"></div>
<div class="modal">
<h2>Please Wait.....</h2>
<img alt="Loading..." src="/Images/loading.gif" />
</div>
</ProgressTemplate>
</asp:UpdateProgress>
I have used the javascript function confirm before this and have taken it out
it was just a onclientclick on the button.
OnClientClick="return confirm('Are you sure you want to submit?');"
but I need to check validation of the page first before asking to submit but I am clueless about it.
here's the behind code atm for the button.
protected void btnEnter_Click(object sender, EventArgs e)
{
if(Page.IsValid )
{
}
}
You could do this even easier and more efficient using client side like this:
you just need to add onclientclick attribute in your <asp:Button ID="btnEnter" control and remove the <asp:ConfirmButtonExtender ID="ConfirmButtonExtender1" from your code.
it would be look like this then :
<asp:Button ID="btnEnter" runat="server" Text="Update"
Width="180" Style="margin-left:157px;"
OnClick="btnEnter_Click"
CssClass="button-success pure-button"
OnClientClick="return confirm('Do you want to see submit?');"/>
and that's it!
So you DO NOT need asp:ConfirmButtonExtender anymore.
UPDATE 1
If you require to check the condition first on the code behind then you could use the code below:
protected void btnEnter_Click(object sender, EventArgs e)
{
if(Page.IsValid )
{
ScriptManager.RegisterStartupScrip(UpdatePanel1, this.GetType(),
"confirm", "return confirm('Are you sure you want to submit?');", true);
}
}
try to Validate your form using jquery then throw the confirmation dialog if the valiation succeeded .
function ValidateForm(){
//validation
if(succeeded){
return confirm('are you sure?');
}else{
return false
}
}
$(document).ready(function(){
$('#' + '<%= btnEnter.ClientID %>').click(function(){
return ValidateForm();
});
});
I was able to implement the selectbox but onchange and OnSelectedIndexChanged are not firing. Any insights?
<div class="hasJS">
<asp:DropDownList class="custom" ID="myid" runat="server" OnSelectedIndexChanged="change" OnTextChanged="change" onChange="myChange();">
<asp:ListItem>Hello</asp:ListItem>
<asp:ListItem>Hello1</asp:ListItem>
<asp:ListItem>Hello3</asp:ListItem>
<asp:ListItem>Hello4</asp:ListItem>
<asp:ListItem>Hello5</asp:ListItem>
<asp:ListItem>Hello6</asp:ListItem>
<asp:ListItem>Hello7</asp:ListItem>
<asp:ListItem>Hello8</asp:ListItem>
</asp:DropDownList>
</div>
<script type="text/javascript">
$(function () {
$("select.custom").each(function () {
var sb = new SelectBox({
selectbox: $(this),
height: 150,
width: 200
});
});
});
function myChange() {
alert("Hai");
}
</script>
set autopostback=true for DropDownList ;
<asp:DropDownList class="custom" autopostback="true" ID="myid" runat="server" OnSelectedIndexChanged="change" OnTextChanged="change" onChange="myChange();">
i just copied your code and guess what it was working fine with AutoPostBack="True",first it shows alert message then twice event was getting fired for both event.i guess you must have implemented below snippet in your code behind file.
protected void change(object sender, EventArgs e)
{
}
for the case of onChange add return to the javascript call
<asp:DropDownList ID="cbProduct" runat="server"
CssClass="common_transaction_textbox_style" onchange="return LoadProductBatchByName();" Height="23px" Width="200px">
</asp:DropDownList>
function LoadProductBatchByName() {
{
alert('test');
}
I have got the Ajax toolkit autocomplete working using the following asp.net and C# code.
<form id="form1" runat="server">
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<div>
Search our Languages: <asp:TextBox ID="txtLanguage" runat="server"></asp:TextBox>
<asp:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server"
TargetControlID="txtLanguage" MinimumPrefixLength="1"
ServiceMethod="GetCompletionList" UseContextKey="True">
</asp:AutoCompleteExtender>
<br />
<br />
<asp:Button ID="btnAddSelected" runat="server" Text="Add to chosen Languages >"
onclick="btnAddSelected_Click" />
<br />
<br />
<asp:Label ID="lblSelectedLanguages" runat="server" Text=""></asp:Label>
</div>
</form>
This is my codebehind C#:
[System.Web.Services.WebMethodAttribute(), System.Web.Script.Services.ScriptMethodAttribute()]
public static string[] GetCompletionList(string prefixText, int count, string contextKey)
{
// Create array of languages.
string[] languages = { "Afrikaans", "Albanian", "Amharic", "Arabic", "Azerbaijani", "Basque", "Belarusian", "Bengali", "Bosnian", "Bulgarian" };
// Return matching languages.
return (from l in languages where l.StartsWith(prefixText, StringComparison.CurrentCultureIgnoreCase) select l).Take(count).ToArray();
}
protected void btnAddSelected_Click(object sender, EventArgs e)
{
lblSelectedLanguages.Text += txtLanguage.Text += ", ";
}
The selected language is added to the label when the button is clicked, however I would like to remove the button and make the selected item from the autocomplete added to the label automatically, using the partial postback from the Ajax toolkit.
Can someone please advise as to how I can achieve this?
Thanks.
Handle OnClientItemSelected on the AutoCompleteExtender control to run a javascript function
All the javascript does is simply fire off the TextChanged event when the selection is made (works on both Enter and left click)
ASPX:
<head runat="server">
<title></title>
<script type="text/javascript">
function ItemSelected(sender, args) {
__doPostBack(sender.get_element().name, "");
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
Search our Languages:
<asp:TextBox ID="txtLanguage" autocomplete="off" runat="server" OnTextChanged="TextChanged" />
<asp:AutoCompleteExtender OnClientItemSelected="ItemSelected" ID="AutoCompleteExtender1"
runat="server" TargetControlID="txtLanguage" MinimumPrefixLength="1" ServiceMethod="GetCompletionList"
UseContextKey="True">
</asp:AutoCompleteExtender>
<br />
<asp:Label ID="lblSelectedLanguages" runat="server"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
Code behind:
protected void TextChanged(object sender, EventArgs e)
{
lblSelectedLanguages.Text += txtLanguage.Text += ", ";
}
It looks like you just need to hook onto the on text changed event of your text box and then put your logic in code benind.Something like this
Markup
<asp:TextBox ID="txtLanguage" OnTextChanged="txtLanguage_textChanged" AutoPostback="true" />
Then in your code behind
protected void txtLanguage_textChanged(object sender, EventArgs e)
{
//use the retrieved text the way you like
lblSelectedLanguages.Text =txtLanguage.Text;
}
Hope this helps.I would also suggest that you try looking into the JQuery autocomplete widget.It has brought me sheer happiness and I surely did divorce the autocomplete extender.
Jquery Autocomplete
I am making web application in asp.net, I have one label control in my .aspx page. I have to set label text value using jquery. want to access this value in my .cs file.
<asp:Label ID="lbltext" runat="server" Text=""></asp:Label>
By using this am able to change label text :
$('#<%= lbltext.ClientID %>').text("Test");
I want to access label text value in code behind page
Thanks in advance..
You can access label value using any event like button client click
here I have given cssclass name for label.
<asp:Label ID="lbltext" runat="server" CssClass="cssTextLabel" Text="Test">
</asp:Label>
<asp:Button ID="btnGetLabelData" Text="Get Data" runat="server" OnClientClick="GetData()" />
define javascript function like below.
<script type="text/javascript">
function GetData() {
var lbltxt = $.find('span.cssTextLabel')[0].innerHTML
__doPostBack('GET_DATA', lbltxt);
}
</script>
handle postback in page load of page as below.
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs)
Handles Me.Load
Dim strLblData As String = String.Empty
If Request("__EVENTTARGET") = "GET_DATA" Then
strLblData = Request("__EVENTARGUMENT").ToString()
Response.Write(strLblData)
End If
End Sub
Hope this will help you.
Hi Yashwant Using HiddenField Control You can solve this issue. use Following Code for that
.aspx File
<asp:HiddenField ID="HiddenField1" runat="server" />
<asp:Label ID="lbltext" runat="server" Text=""></asp:Label>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
By using this am able to HiddenField Value :
<script type="text/javascript">
$(document).ready(function () {
$("#HiddenField1").val('Hello');
});
</script>
In .CS File
protected void Button1_Click(object sender, EventArgs e)
{
lbltext.Text = HiddenField1.Value;
Page.RegisterStartupScript(new Guid().ToString(), "<script type='text/javascript'>alert('"+lbltext.Text+"');</script>"); // alert the label value
}
I am sure that is useful for you.
Simply you can access your label text from your cs file as follows.
string myLabelText = this.lbltext.Text;
I am firing an event from an ascx control in order to update some controls in the container to which the ascx control belongs.
The ascx control is displayed via a modal popup extender. When I click a button inside the ascx, I fire an event to which the container containing the ascx control is subscribes.
The event delegate is fired and the expected logic is run in the container's code behind, the problem is that any changes made to controls inside not the container aren't updated despite the event logic having been processed. The expected changes are not reflected on the page when the results of the postback is rendered.
Are there any pitfalls I should know of?
The markup for the container
<asp:Panel ID="panelTreeViewAttributesTitle" runat="server">
<asp:Label ID="someLabel" runat="server" Text="Hello Governor" />
<asp:LinkButton ID="LinkButtonEdit" runat="server" Text="(Edit)" />
<ajax:ModalPopupExtender BackgroundCssClass="modalBackground" Enabled="True"
ID="btnEdit_ModalPopupExtender" PopupControlID="modalPanel" runat="server"
TargetControlID="LinkButtonEdit" />
</asp:Panel>
<asp:Panel ID="modalPanel" runat="server" CssClass="modalPopUp" Style="display: none">
<xxx:customControl runat="server" ID="myCustomControl" />
</asp:Panel>
The code behind for the container
protected void Page_Load(object sender, EventArgs e)
{
myCustomControl.Updated += eventCaptured;
if (IsPostBack) return;
...
}
void eventCaptured(object sender, EventArgs e)
{
someLabel.Text = "Goodbye Governor";
}
The custom control
<script type="text/javascript">
function Update() {
var ajaxManager = $find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>");
if (ajaxManager != null)
ajaxManager.ajaxRequest("");
}
</script>
<asp:Panel ID="panelEditPanel" runat="server">
<asp:Label ID="lblCMA" runat="server" Text="Call me Arnooold." />
</asp:Panel>
<asp:Button ID="btnUpdate" runat="server" Text="Update" OnClientClick="Update()" />
<asp:Button ID="btnCancel" runat="server" Text="Cancel" />
The custom control's code behind
public event EventHandler Updated;
protected void AjaxManager_AjaxRequest(object sender, AjaxRequestEventArgs e)
{
//Some DB backend logic
UpdateFinished();
}
private void UpdateFinished()
{
if (Updated == null) return;
Updated(this, null);
}
Maybe the button click is causing a partial post back instead of a normal, full-page post back. If this is the case, the entire life cycle would run on the server side (including your event handler) but only part of the HTML would be updated on the client side when the response comes back to the browser. "someLabel" could be outside the region that gets updated on the client side.