I'm currently starting to delve into the world of ASP.Net. Thus far, I've been creating most of my pages in HTML styling with CSS accordingly and more recently I've been applying a Site.Master page to my pages to neaten up the code. I'm creating a page that needs a drop down list control that will eventually reach into a database and display pertinent information, but for now I've kept it simple, and the page simply updates with "You have selected Item 1" when you select an item on the drop down list. Problem is, I can't seem to figure out how to apply the scripting to the page.
So far this is what I have:
<%# Page Title="Bowtie Performance Parts - Inventory" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeBehind="parts.aspx.cs" Inherits="WebApplication1._Default"%>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<!--Dropdown Menu Setup-->
<head>
</head>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<h1 class="defaultTitle">Parts Catalog</h1>
<p id="defaultLarge">Please Choose from the list below to get started!</p>
<center>
<form id="PartsForm" runat="server">
<asp:DropDownList id="dropDown2" runat="server">
<asp:ListItem>Please Choose</asp:ListItem>
<asp:ListItem disabled="disabled">--Motors--</asp:ListItem>
<asp:ListItem>4 Cylinder</asp:ListItem>
<asp:ListItem>6 Cylinder</asp:ListItem>
<asp:ListItem>8 Cylinder</asp:ListItem>
<asp:ListItem disabled="disabled">--Intakes--</asp:ListItem>
<asp:ListItem disabled="disabled">--Forced Induction--</asp:ListItem>
<asp:ListItem>Superchargers</asp:ListItem>
<asp:ListItem>Turbos</asp:ListItem>
</asp:DropDownList></form>
</center>
</asp:Content>
The page is styled and displays as expected, the drop down menu displays and works as it should, but now I'm trying to find out where to place the script so that when I choose an item on the list, it displays "You have selected Item #".
<script runat="server">
Sub submit(sender As Object, e As EventArgs)
mess.Text="You selected " & dropDown2.SelectedItem.Text
End Sub
</script>
Placing this script anywhere in the code results in an error and the page not compiling correctly. I'm new at using C# and ASP.net, and I'm not sure I have a grasp on the logic of how to do this. I've looked at plenty of examples as such:
<script runat="server">
Sub submit(sender As Object, e As EventArgs)
mess.Text="You selected " & drop1.SelectedItem.Text
End Sub
</script>
<!DOCTYPE html>
<html>
<body>
<form runat="server">
<asp:DropDownList id="drop1" runat="server">
<asp:ListItem>Item 1</asp:ListItem>
<asp:ListItem>Item 2</asp:ListItem>
<asp:ListItem>Item 3</asp:ListItem>
<asp:ListItem>Item 4</asp:ListItem>
<asp:ListItem>Item 5</asp:ListItem>
<asp:ListItem>Item 6</asp:ListItem>
</asp:DropDownList>
<asp:Button Text="Submit" OnClick="submit" runat="server"/>
<p><asp:label id="mess" runat="server"/></p>
</form>
</body>
</html>
But applying the script that way prevents me from referencing the Site.Master page which contains a Banner, NavBar and a link to a .css file that style the entire site (going for uniformity across all webpages).
How can this be done?
Thanks in advance,
Tyler Dean
In your code behind use drop1_SelectedIndexChanged event
Protected Sub drop1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles drop1.SelectedIndexChanged
mess.text = drop1.SelectedValue
End Sub
This is in VB but you can convert it to C#.
Related
I am working on a project in C# .NET that allows me only one form in the .aspx file.
<form id="form1" runat="server" action="#1">
How can I change the form action through the C# code in a method?
I have tried this:
protected void Button1_Click(object sender, EventArgs e)
{
form1.Action = "#2";
}
but it didn't work. Thanks in advance...
Based on the comments to you question. asp:Panel Controls could help you out.
A very rough example
ASPX:
<form id="form1" runat="server">
<asp:Panel id="Form1" runat="server">
<!-- Form 1 Stuff -- >
<asp:Button ID="Button1" runat="server" Text="Submit"
OnClick="Button1_Click" />
</panel>
<asp:Panel id="Form2" runat="server" Visible="false">
<!-- Form 2 Stuff -- >
<asp:Button ID="Button2" runat="server" Text="Submit"
OnClick="Button2_Click" />
</panel>
</form>
C#
protected void Button1_Click(object sender, EventArgs e)
{
//HIde "Form"1
Form1.Visible = false;
//Show "Form"2
Form2.Visible = true;
//Do other stuff
}
protected void Button2_Click(object sender, EventArgs e)
{
//Do Final Processig
}
Also look at the DefaultButton property of the Panel
(Moving this to the top because it's an answer to the newly understood question. It's not how to change the form action, but how to have multiple forms.)
If you want a server form on a page that already has a server form then perhaps that second "form" should be a User Control. That way it sits inside the host page's server form but doesn't require its own form. And it's self-contained, able to contain whatever logic it needs when handling a postback.
Here's an example of a simple User Control. You can create one from Add > New Item > Web > Web Forms User Control.
<%# Control Language="C#" AutoEventWireup="true"
CodeBehind="OtherForm.ascx.cs" Inherits="WebApplication1.OtherForm" %>
<label for="<% = OtherFormTextInput.ClientID %>">
This is some other form on the same page
</label>
<asp:TextBox runat="server" ID="OtherFormTextInput"></asp:TextBox>
<asp:Button runat="server" ID="Submit" Text="Submit this other form"/>
It looks like an .aspx page but it has no form. It can still have its own code behind which can interact with with the other server controls it contains, just like an .aspx page would.
Then you add that control to your "main" page:
<%# Page Language="C#" AutoEventWireup="true"
CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>
<!-- Register the user control -->
<%# Register TagPrefix="uc" TagName="other" Src="~/OtherForm.ascx" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<!-- This form has its own stuff, but also contains the "other" form. -->
<uc:other runat="server" ID="TheOtherForm"></uc:other>
</form>
</body>
</html>
I recommend this over using panels (which still works) because if you're putting two forms on one page, it's likely that you might at some point want to move the secondary form to another page or re-use it. This approach keeps it completely self-contained. Its code-behind isn't in the same file as the the .aspx page. You can place this on as many pages as you want.
Original "literal" answer which addresses the question as originally understood.
The runat="server" form exists entirely for the purpose of allowing ASP.NET to interact with the page and its server controls during postbacks. It's central to the way webforms works. If you change the action then technically what you have isn't a webforms page any more.
That's fine (I don't even like webforms) but it can lead to some weird behavior. If you have controls that trigger postbacks then normally they'd be handled on the same page and your user would just see a (hopefully) fast refresh. Now they might get sent to another page.
What if you just removed that form entirely and added your own form instead? Then your .aspx page will just behave more like an .html page.
Having added all the disclaimers about why not to do it, you can change the action using JavaScript. Here's a sample:
<%# Page Language="C#" AutoEventWireup="true"
CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server" ClientIDMode="Static">
<asp:Button runat="server" text="Causes postback"/>
<asp:CheckBox runat="server" AutoPostBack="True"/>
</form>
<script>
document.getElementById("form1").action = "http://stackoverflow.com";
</script>
</body>
</html>
Some browsers might not allow changing the form's action.
I put the checkbox there just for fun (I must be really bored) to show the odd side effects it could have, that you might click on a checkbox and get redirected to a different page.
You can write a response.write() in your Asp.net side that print some javascript or jQuery code! As #Scott Hannen wrote some javascript like this :
Response.Write("<script>document.getElementById('YOURFORMID').action = 'YOUR URL';</script>");
or with jQuery
Response.Write("<script>$('#YOUR FORM ID').attr('action', 'YOUR URL');</script>");
btw if you have access to .html or .js files u can directly put this jQuery code without any C# code!
I have a page that works fine with multiple a grid and multiple buttons. The page works fine until I add an asp:UpdatePanel. Then I get the following message pushing any of my buttons:
Sys.WebForms.PageRequestManagerServerErrorException: Input string was not in a correct format.
There is no javascript on the page just straight html.
Here is the page:
<%# Page Title="" Language="C#" MasterPageFile="~/MasterPages/Site.Master" AutoEventWireup="true"
CodeBehind="TestUpdatePanel.aspx.cs" Inherits="ASCWeb.TestUpdatePanel" %>
<asp:Content ID="mHeadContent" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>
<asp:Content ID="mBodyContent" ContentPlaceHolderID="MainContent" runat="server">
<asp:UpdatePanel ID="pnlUpdate" runat="server">
<ContentTemplate>
<asp:TextBox ID="txtUser" runat="server" />
<asp:ImageButton ID="btnAdd" runat="server" ImageUrl="~/Images/Add.png" />
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
If I take the TextBox out, it works fine. Nothing is in the code behind.
What would cause this?
Thanks
As per experience, I only encounter that exception when calling Javascript from codebehind, like when using ScriptManager.RegisterClientScriptBlock() to call window.alert(), for instance. But for this issue, I think this resolves it: http://forums.asp.net/t/1823287.aspx/2/10.
Say I have one full-page form, but within the form, there are two or more events that need to take place on submission: Login & Register
Site.Master:
<%# Master Language="C#" AutoEventWireup="true"
EnableViewState="true" CodeBehind="Site.Master.cs"
Inherits="Site.SiteMasterPage" %>
<!doctype>
<html>
<head runat="server">
<%-- stuff --%>
</head>
<body>
<form ID="MainForm" action="" runat="server">
<asp:Login id="LoginControl" runat="server" />
<asp:CreateUserWizard id="RegisterControl" runat="server" />
</form>
</body>
</html>
If my cursor is focused inside of an input type="text" for asp:Login, and I hit Return (with javascript off), the page submits, but I am not logged in.
The same thing happens when I attempt to register (filling out the createUserWizard and hitting the Return key instead of actually clicking "Register", firing some event)
Is there any non-JavaScript solution for getting the Return key to submit the proper, currently focused portion of the form?
The panel control allows you to define a default button within the scope of it's contents:
<asp:Panel runat="server" DefaultButton="submitButtonA">
<asp:LinkButton ID="submitButtonA" runat="server" Text="Submit A"/>
</asp:Panel>
<asp:Panel runat="server" DefaultButton="submitButtonB">
<asp:LinkButton ID="submitButtonB" runat="server" Text="Submit A"/>
</asp:Panel>
The default button sounds like it might be your friend tonight - http://msdn.microsoft.com/en-us/library/system.web.ui.htmlcontrols.htmlform.defaultbutton.aspx
Actually it might not be, I haven't ever tried it with no Javascript.
i have in my code a table with a text field and a button on each cell. My problem it's that the button and the field are not recognized like System.Web.UI.WebControls.Button and System.Web.UI.WebControls.TextBox respectively. In fact recognize like buton are textfield html plain. I'm going to put my code so if anybody can see what i'm doing wrong.
Note: If i put this elemets out of the table work so i assumed that something wrong in the table
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="MapaPrueba._Default" %>
<!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>Uso de google map</title>
<link href='/assets/css/styles.css' rel='stylesheet' type='text/css' />
</head>
<body>
<form id="form1" runat="server">
<asp:Panel runat="server" Height="1024" Width="768" style="text-align: center">
<div id="map-canvas" style="width: 700px; height: 500px" align="center"></div>
<asp:Table id="Table1" runat="server" CellPadding="10" GridLines="Both" HorizontalAlign="Center">
<asp:TableRow runat="server">
<asp:TableCell runat="server">
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
</asp:TableCell>
<asp:TableCell>
<asp:TextBox ID="TextBox1" runat="server" ></asp:TextBox>
</asp:TableCell>
</asp:TableRow>
</asp:Table>
</asp:Panel>
</form>
</body>
</html>
I would follow atrljoe's suggestion. Don't use an asp table, just use
<table>
<tr>
<td>
controls go here
</td>
<tr>
</table>
Tip: If you add the table first, switch in VS to Design View and using Ctrol + Alt + arrows you can add new rows and columns easily
You cant access the controls because your placing a Control (ASP Button & ASP TextBox) within a Control (ASP Table) ASP.NET Table. Every ASP.net page has a control tree, all the controls (HTML and server controls are in this control tree based on their position in page hierarchy). Thus since it is contained within the Control, the system is not picking it up. To gain access to this control you would need to use FindControl in your code behind.
As I had asked, If you really need to control this button and textbox, then consider changing to an HTML table. Otherwise when you reference these controls in your code behind you will need to use FindControl
i want to add a rsionbuttonlist to my ascx web control.. i keep getting an error that ineed to put the radionbuttonlist inside a tag. is there a way around this?
"
<%# Control Language="C#" AutoEventWireup="true" CodeFile="step2.ascx.cs" Inherits="ascx_step2" %>
<div id="step2" runat="server">
<asp:RadioButtonList id="answers" runat="server">
</asp:RadioButtonList>
<div>
"
in the code behind:
ListItem item = new ListItem("a", "a")
answers.Items.Add(item);
the error :
control "ctl_00..." of type radiobutton must be placed inside a form tag with runat=server
<table>
<tr>
<td>
Drag and drop from the tool box, in UI mode
<td>
</tr>
</table>
Make sure the control is added to the containing page (containing a form element) properly and the radio button list is declared correctly:
<asp:RadioButtonList ID="rblSomeRadioButtonList" runat="server">
<asp:ListItem Text="Something" Value="True"/>
</asp:RadioButtonList>
Here are a few things to check:
Perhaps this was just a typo, but your example .ascx markup has a leading and trailing quote that does not belong in a real .ascx file.
Ensure that your user control is placed on a page within the form tag.
MyPage.aspx:
<html>
<body>
<form id="form1" runat="server">
<myprefix:MyUserControl ID="mycontrol" runat="server" />
</form>
</body>
</html>
If you are dynamically adding your user control to the page in code-behind, make sure you are adding it to something that is already inside the correct form tag.