I'm using MultiView to build a multi step form. The next button works on the first step (ViewOne) but then both the next and back buttons do nothing at the next step (ViewTwo).
I don't know if there is any clue in the below code or you need to see more?...
<asp:MultiView ID="MultiView2" runat="server" ActiveViewIndex="0">
<asp:View ID="ViewOne" runat="server">
</asp:View>
<asp:View ID="ViewTwo" runat="server">
</asp:View>
</asp:MultiView>
<asp:ImageButton ID="btnBack" runat="server" ImageUrl="/assets/back_button.jpg" OnClick="btnBack_Click" />
<asp:ImageButton ID="btnNext" runat="server" ImageUrl="/assets/next_button.gif" OnClick="btnNext_Click" />
<asp:ImageButton ID="btnSubmit" runat="server" ImageUrl="/assets/submit_button.gif" OnClick="btnSend_Click" />
Code behind....
protected void btnBack_Click(object sender, EventArgs e)
{
MultiView2.ActiveViewIndex--;
}
protected void btnNext_Click(object sender, EventArgs e)
{
MultiView2.ActiveViewIndex++;
}
protected void btnSend_Click(object sender, EventArgs e)
{
OnSubmitClicked(e);
}
Ok more code...
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
PopulateSomeField();
}
protected override void OnPreRender(EventArgs e)
{
btnBack.Visible = MultiView2.ActiveViewIndex > 0;
btnNext.Visible = MultiView2.ActiveViewIndex < MultiView2.Views.Count - 1;
btnSubmit.Visible = MultiView2.ActiveViewIndex == MultiView2.Views.Count - 1;
base.OnPreRender(e);
}
There's no error there. It works just fine for me.
Test2.aspx:
<%# Page Language="C#" AutoEventWireup="true" CodeFile="test2.aspx.cs" Inherits="test2" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:MultiView ID="MultiView2" runat="server" ActiveViewIndex="0">
<asp:View ID="ViewOne" runat="server">
One
</asp:View>
<asp:View ID="ViewTwo" runat="server">
Two
</asp:View>
</asp:MultiView>
<asp:ImageButton ID="btnBack" runat="server" ImageUrl="/assets/back_button.jpg" OnClick="btnBack_Click" />
<asp:ImageButton ID="btnNext" runat="server" ImageUrl="/assets/next_button.gif" OnClick="btnNext_Click" />
<asp:ImageButton ID="btnSubmit" runat="server" ImageUrl="/assets/submit_button.gif" OnClick="btnSend_Click" />
</div>
</form>
</body>
</html>
Test2.aspx.cs:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class test2 : System.Web.UI.Page
{
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
//PopulateSomeField();
}
protected override void OnPreRender(EventArgs e)
{
btnBack.Visible = MultiView2.ActiveViewIndex > 0;
btnNext.Visible = MultiView2.ActiveViewIndex < MultiView2.Views.Count - 1;
btnSubmit.Visible = MultiView2.ActiveViewIndex == MultiView2.Views.Count - 1;
base.OnPreRender(e);
}
protected void btnBack_Click(object sender, EventArgs e)
{
MultiView2.ActiveViewIndex--;
}
protected void btnNext_Click(object sender, EventArgs e)
{
MultiView2.ActiveViewIndex++;
}
protected void btnSend_Click(object sender, EventArgs e)
{
Response.Write("submitted");
}
}
Related
I am trying to make the input box show some text in the asp.net using c#, but after I run the code behind, nothing is displayed in the input box. The ui is RadNumericTextBox uiDistance. In class, I put this.uiDistance.Text = "123"; But in the webpage after run the code. I cannot see "123" is put in the uiDistance text box. How can I fix it?
Here is my aspx UsageControl2SubControl1.ascx
<%# Control Language="C#" AutoEventWireup="true" CodeBehind="UsageControl2SubControl1.ascx.cs" Inherits="WebControls.UsageControl2SubControl1" %>
<asp:HiddenField ID="uiRemoved" Value="false" runat="server" />
<asp:HiddenField ID="uiID" runat="server" />
<div class="form-group">
<div class="col-md-2 customColumnPadding">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<telerik:RadTextBox ID="uiToLocation" runat="server" Width="100%" AutoPostBack="true"
OnTextChanged="uiToLocation_Leave" EmptyMessage="<%$ Resources:ResourceHKEx,Arrive_To %>" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="col-md-2 customColumnPadding" id="uiColumnDistance" runat="server">
<telerik:RadNumericTextBox ID="uiDistance" runat="server" Width="100%" MinValue="0" NumberFormat-DecimalDigits="2" EmptyMessage="<%$ Resources:Resource,Distance %>" />
</div>
</div>
<div class="hr-line-dashed"></div>
And Here is my code behind: UsageControl2SubControl1.ascx.cs
using System;
using System.Collections.Generic;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Telerik.Web.UI;
namespace WebControls
{
public partial class UsageControl2SubControl1 : System.Web.UI.UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
if (Convert.ToBoolean(uiRemoved.Value))
{
this.Visible = false;
}
}
protected void uiAdd_Click(object sender, Telerik.Web.UI.ImageButtonClickEventArgs e)
{
}
protected void uiRemove_Click(object sender, Telerik.Web.UI.ImageButtonClickEventArgs e)
{
}
protected void RadComboBoxProduct_ItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
{
}
protected void uiAdd_Click1(object sender, ImageClickEventArgs e)
{
}
protected void uiRemove_Click1(object sender, ImageClickEventArgs e)
{
}
protected void uiToLocation_Leave(object sender, EventArgs e)
{
this.uiDistance.Text = "123";
}
}// end class
}// end namespace
Just to update your aspx code little bit
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div class="form-group">
<div class="col-md-2 customColumnPadding">
<telerik:RadTextBox ID="uiToLocation" runat="server" Width="100%" AutoPostBack="true"
OnTextChanged="uiToLocation_Leave" EmptyMessage="<%$ Resources:ResourceHKEx,Arrive_To %>" />
</div>
<div class="col-md-2 customColumnPadding" id="uiColumnDistance" runat="server">
<telerik:RadNumericTextBox ID="uiDistance" runat="server" Width="100%" MinValue="0" NumberFormat-DecimalDigits="2" EmptyMessage="<%$ Resources:Resource,Distance %>" />
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
As your textbox is only inside the update panel so, on post back only that portion is partially updated, you need to put RadNumericTextBox inside the update panel too.
Hope this will work.
You are using the wrong property. Use Value not Text
protected void uiToLocation_Leave(object sender, EventArgs e)
{
this.uiDistance.Value = "123";
}
As always, check the documentation. See: https://docs.telerik.com/devtools/aspnet-ajax/controls/numerictextbox/features/getting-and-setting-values
Your current code will works only when you tab out from uiToLocation textbox.
If you want to show it when page loads, just move your code in to Page_Load event instead uiToLocation_Leave.
protected void Page_Load(object sender, EventArgs e)
{
if (Convert.ToBoolean(uiRemoved.Value))
{
this.Visible = false;
}
this.uiDistance.Text = "123"; // it will assign when page loads.
}
If you want to load it only once when page loads, use IsPostaback, see below.
protected void Page_Load(object sender, EventArgs e)
{
if (Convert.ToBoolean(uiRemoved.Value))
{
this.Visible = false;
}
if (!IsPostBack)
{
this.uiDistance.Text = "123"; // it will assign only once when page loads.
}
}
IT seems you are using the wrong property to assign value to telerik Textbox.
Use .Value property as .Text property if for default aspx Textbox control
this.uiDistance.Value= "123"
I want to use FileUpload Control to save Image to Database. The HasFiles return always false after I click on BtnSave. I tried with and without UpdatePanel but could not find the solution.
My code is:
protected void BtnSave_Click(object sender, EventArgs e)
{
if (FileUpload1.HasFile == true)
{
var ChNumber = txtNumber.Text;
string img = this.FileUpload1.PostedFile.FileName;
//Save image to database function
}
else
{
lblStatus.Text="Image not Uploaded";
}
}
Try with a simple form without UpdatePanel. Here's the markup:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:FileUpload ID="FileUpload1" runat="server" />
<asp:Button ID="BtnSave" runat="server" Text="Button" OnClick="BtnSave_Click" />
<asp:TextBox ID="txtNumber" runat="server"></asp:TextBox>
<asp:Label ID="lblStatus" runat="server" Text="Label"></asp:Label>
</div>
</form>
</body>
</html>
And here's the code:
using System;
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void BtnSave_Click(object sender, EventArgs e)
{
if (FileUpload1.HasFile == true)
{
var ChNumber = txtNumber.Text;
string img = this.FileUpload1.PostedFile.FileName;
//Save image to database function
}
else
{
lblStatus.Text = "Image not Uploaded";
}
}
}
I set a brekapoint at if (FileUpload1.HasFile == true) and see the uploaded file is there.
I am getting the dreaded exception "Cannot unregister UpdatePanel with ID 'UpdatePanel' since it was not registered with the ScriptManager" when trying to combine a popup window and some Cross-Page Posting. I've been able to reproduce the problem with a small example.
I have seen other questions that handle the Unload event for the UpdatePanel, but that doesn't seem to work with the addition of the Cross Page Posting.
How do I get around this issue?
To duplicate the issue with the code below:
Start the Setup page
Press the View Popup link
Close the popup
Press the Next button to transfer to the Target page
Press the Back button to transfer to the Setup page
Press the View link and close the popup
Press the Next button, and see the failure
Here are the highlights (forgive the length, but it should be cut-and-pastable):
Setup.aspx
<head runat="server">
<title>Setup </title>
<script type="text/javascript">
function openCenteredWindow(url, height, width, name, parms) {
//Snip setting up window location stuff
var win = window.open(url, name, winParms);
return win;
}
</script>
</head>
<body>
<h1>Setup Page</h1>
<form id="aspnetForm" runat="server">
<div>
<asp:TextBox ID="txtData" runat="server" Width="80%" Text="<%# Information %>" />
<br />
<asp:LinkButton ID="lbViewData" runat="server"
OnClientClick="aspnetForm.target='ViewDataPopup';"
Text="View In Popup" /> <br />
<asp:Button ID="btnNext" runat="server" Text="Next" OnClick="btnNext_Click" />
</div>
<div>
<br />
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:updatepanel ID="UpdatePanel" runat="server" OnUnload="UpdatePanel_Unload"></asp:updatepanel>
</div>
</form>
</body>
Setup.Aspx.cs
public partial class Setup : System.Web.UI.Page
{
protected override void LoadViewState(object savedState)
{
base.LoadViewState(savedState);
if (this.ViewState["Information"] != null)
_Information = this.ViewState["Information"].ToString();
}
protected override object SaveViewState()
{
this.ViewState["Information"] = _Information;
return base.SaveViewState();
}
protected void Page_Load(object sender, EventArgs e)
{
if (PreviousPage != null && PreviousPage is TargetPage)
{
_Information = ((TargetPage)PreviousPage).SetupData;
}
else if (!Page.IsPostBack)
{
_Information = String.Format("This test started at {0}", DateTime.Now);
}
Page.DataBind();
lbViewData.PostBackUrl = "ViewData.aspx?u=0";
lbViewData.Attributes.Add("onclick", "JavaScript:openCenteredWindow(\"ViewData.aspx?u=0\", 400, 300, \"ViewDataPopup\", 'scrollbars=yes');");
}
private string _Information;
public string Information
{
get { return _Information; }
}
protected void btnNext_Click(object sender, EventArgs e)
{
HttpContext.Current.Server.Transfer("~/TargetPage.aspx");
}
}
ViewData.aspx
<%# PreviousPageType VirtualPath="~/Setup.aspx" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head runat="server">
<title>View Data</title>
<script type="text/javascript">
function fixForm() {
opener.document.getElementById("aspnetForm").target = "";
opener.document.getElementById("aspnetForm").action = "";
}
</script>
</head>
<body onload="fixForm()">
<form id="aspnetForm" runat="server">
<div>
<h2 >View Data</h2>
</div>
<asp:Label ID="lblData" runat="server" Text="<%# SetupData %>" />
</form>
</body>
ViewData.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
if (PreviousPage != null)
{
Setup setup = (Setup)PreviousPage;
this.SetupData = setup.Information ?? "Data not set in Setup Page";
}
Page.DataBind();
}
private string _setupData = "Did not get updated data";
protected string SetupData
{
get { return _setupData; }
set { _setupData = value; }
}
TargetPage.aspx
<%# PreviousPageType VirtualPath="~/Setup.aspx" %>
<body style="background-color: #9999BB">
<h1>Target Page</h1>
<form id="aspnetForm" runat="server">
<div>
<asp:Label ID="lblData" runat="server" Text="<%# SetupData %>" /><br />
<asp:Button ID="btnBack" runat="server" Text="Back" OnClick="btnBack_Click" />
</div>
</form>
</body>
TargetPage.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
if (this.PreviousPage == null)
Response.Redirect("Setup.aspx");
this.SetupData = PreviousPage.Information;
}
Page.DataBind();
}
public string SetupData
{
get { return ViewState["SetupData"].ToString(); }
set { ViewState["SetupData"] = value; }
}
protected void btnBack_Click(object sender, EventArgs e)
{
HttpContext.Current.Server.Transfer("~/Setup.aspx");
}
As you can see, it's enough to have the UpdatePanel just sitting on the page and doing nothing for this error to occur.
I can get both the Javascript and the C# function to work just fine.
However, my Javascript function runs before the C#.
How do I get it to run after the C# function??
Here is my code:
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">
<asp:View ID="View1" runat="server">
<div id="div2" style="height:70px; width:auto; text-align:center;">
<p><b>This is A View!!!</b></p>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>
<div id="div1">
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click"
OnClientClick="javascript:Highlit()" />
</div>
</asp:View>
</asp:MultiView>
<script type="text/javascript">
function Highlit()
{
$("#div2").effect("highlight", {}, 10000);
}
</script>
</ContentTemplate>
</asp:UpdatePanel>
Code behind:
namespace jQuery_Highlight.jQuery_Highlight
{
public partial class jQuery_HighlightUserControl : UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
{
Label1.Text = "Changed";
}
}
}
Here is the code reflecting changes from the answers:
Code behind
namespace jQuery_Highlight.jQuery_Highlight
{
public partial class jQuery_HighlightUserControl : UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
{
Label1.Text = "Changed";
ScriptManager.RegisterStartupScript(this, this.GetType(), "TEST", "Highlit();", true);
}
}
}
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">
<asp:View ID="View1" runat="server">
<div id="div2" style="height:70px; width:auto; text-align:center;">
<p><b>This is A View!!!</b></p>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>
<div id="div1">
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
</div>
</asp:View>
</asp:MultiView>
</ContentTemplate>
</asp:UpdatePanel>
<script type="text/javascript">
function Highlit() {
$("#div2").effect("highlight", { color: "#9499FC" }, 10000);
}
</script>
The only way to get the javascript to run after is to add a script reference in your Button1_Click event.
Example Code for standard postback:
protected void Button1_Click(object sender, EventArgs e)
{
Label1.Text = "Changed";
Page.ClientScript.RegisterStartupScript(this.GetType(), "PostButton1_ClickScript", "Highlit();", true);
}
As noted by others, be sure to remove your OnClientClick event. Also, consider moving your "Highlit" script outside of the update panel.
Additionally, since you are in an update panel, you will need to use the following example code for a Partial Postback:
protected void Button1_Click(object sender, EventArgs e)
{
Label1.Text = "Changed";
ScriptManager.RegisterStartupScript(this, this.GetType(), "PostButton1_ClickScript", "Highlit();", true);
}
You have to register a ClientScript at the end of Button1_Click event
and remove OnClientClick="javascript:Highlit()"
protected void Button1_Click(object sender, EventArgs e)
{
//Do stuff
ScriptManager.RegisterStartupScript(this, this.GetType(), "ANYNAME", "javascript:Highlit();", true);
}
Remove the OnClientClick attribute, and add the call as a startup script, so that it runs after the page has loaded:
protected void Button1_Click(object sender, EventArgs e) {
Label1.Text = "Changed";
Page.ClientScript.RegisterStartupScript(this.GetType(), "start", "Highlit();", true);
}
Side note: When you use the OnClientClick attribute, the code should not start with javascript:. That's only used when you put script in a href attribute in a link.
I'm trying to copy the docklayout from one page and try to recreate it in another page.
Here is my code-
Default.aspx
<div>
<telerik:RadDockLayout ID="dockLayout" runat="server" OnSaveDockLayout="dockLayout_SaveDockLayout">
<telerik:RadDockZone ID="dockZone" runat="server">
<telerik:RadDock ID="dock" runat="server" UniqueName="dock1">
<Commands>
</Commands>
<ContentTemplate>
<asp:TextBox ID="txtName" runat="server" Text="Dock1"></asp:TextBox>
<br />
<asp:Button ID="btnOK" runat="server" Text="OK1" />
</ContentTemplate>
</telerik:RadDock>
</telerik:RadDockZone>
<br /><br />
<telerik:RadDockZone ID="RadDockZone1" runat="server">
<telerik:RadDock ID="RadDock1" runat="server" UniqueName="dock2">
<Commands>
</Commands>
<ContentTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text="Dock2"></asp:TextBox>
<br />
<asp:Button ID="Button1" runat="server" Text="OK2" />
</ContentTemplate>
</telerik:RadDock>
</telerik:RadDockZone>
</telerik:RadDockLayout>
<div style="width:100%;text-align:center">
<asp:Button ID="btnSave" runat="server" Text="Save" onclick="btnSave_Click" />
</div>
</div>
Default.aspx.cs
protected void dockLayout_SaveDockLayout(object sender, DockLayoutEventArgs e)
{
List<DockState> dockState = dockLayout.GetRegisteredDocksState();
JavaScriptSerializer ser = new JavaScriptSerializer();
Session["dock"] = ser.Serialize(dockState);
}
protected void btnSave_Click(object sender, EventArgs e)
{
Response.Redirect("receivingPage.aspx");
}
receivingPage.aspx.cs
public partial class receivingPage : System.Web.UI.Page
{
private List<DockState> dockStates;
private RadDockLayout dockLayout;
protected override void OnInit(EventArgs e)
{
dockLayout = new RadDockLayout();
dockLayout.LoadDockLayout += new DockLayoutEventHandler(dockLayout_LoadDockLayout);
JavaScriptSerializer ser = new JavaScriptSerializer();
dockStates = ser.Deserialize<List<DockState>>(Page.Session["dock"].ToString());
for (int i = 0; i < dockStates.Count; i++)
{
RadDock dock = new RadDock();
dock.ID = string.Format("RadDock{0}", i);
dock.ApplyState(dockStates[i]);
dockLayout.Controls.Add(dock);
}
this.Controls.Add(dockLayout);
}
protected void Page_Load(object sender, EventArgs e)
{
}
void dockLayout_LoadDockLayout(object sender, DockLayoutEventArgs e)
{
foreach (DockState state in dockStates)
{
e.Positions[state.UniqueName] = state.DockZoneID;
e.Indices[state.UniqueName] = state.Index;
}
}
}
But I'm getting emtpy docklayout in receivingPage.aspx. Any ideas?
I would suggest to contact Telerik via the forum or to send a support ticket with a sample project.