Invalid postback or callback argument. on button click - c#

I have following code snippet in my asp.net webpage.
<div id="descDiv" style="display:none;">
<form>
<asp:TextBox ID="inputDesc" Height="200px" Width="100%" runat="server" TextMode="MultiLine" placeholder="Enter any details you know about this city" required="required"></asp:TextBox>
<input type="button" Class="cancel" value="Cancel" OnClick="hideInput('descDiv');" /><asp:Button ID="Submit_Desc" CssClass="submit" runat="server" Text="Submit" OnClick="Submit_Desc_Click" />
</form>
</div>
When I click the submit button I receive this error:
Invalid postback or callback argument. Event validation is enabled using
<pages enableEventValidation="true"/> in configuration or
<%# Page EnableEventValidation="true" %> in a page.
For security purposes, this feature verifies that arguments to postback or
callback events originate from the server control that originally rendered them.
If the data is valid and expected, use the
ClientScriptManager.RegisterForEventValidation method in order to register the
postback or callback data for validation.
This form is enclosed in another main form which has 'runat' attribute. What should I do to correct this problem?
EDIT:
Here is the shortest code to reproduce the problem:
<%# 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">
<div>
<div id="descDiv">
<form>
<asp:TextBox ID="inputDesc" Height="200px" Width="100%" runat="server" TextMode="MultiLine" placeholder="Enter any details you know about this city" required="required"></asp:TextBox>
<input type="button" class="cancel" value="Cancel" onclick="hideInput('descDiv');" />
<asp:Button ID="Submit_Desc" CssClass="submit" runat="server" Text="Submit" OnClick="Submit_Desc_Click"/>
</form>
</div>
</div>
<form>
<asp:TextBox ID="TextBox1" Height="200px" Width="100%" runat="server" TextMode="MultiLine" placeholder="Enter any details you know about this city" required="required"></asp:TextBox>
<input type="button" class="cancel" value="Cancel" onclick="hideInput('descDiv');" />
<asp:Button ID="Button1" CssClass="submit" runat="server" Text="Submit" OnClick="Submit_Desc_Click"/>
</form>
</form>
</body>
</html>

You cannot have two forms on your page, remove the form tag just under your div. The one to keep has to be the form runat="server" since it's a .net page.
what you can do is use .net buttons and process whatever they do from code behind
<form id="form1" runat="server">
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
<asp:Button ID="Button2" runat="server" Text="Button" OnClick="Button2_Click" />
</form>
protected void Button1_Click(object sender, EventArgs e)
{
// do something with button 1
}
protected void Button2_Click(object sender, EventArgs e)
{
// do something with button 2
}

Related

Upload file control not showing any file in the code behind

I have a very simple application. I am trying to upload the file using File upload control of ASP.net. Below is my entire .cs code and .aspx code:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace TestFileUpload1
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void uploadFile_Click(object sender, EventArgs e)
{
if (UploadImages.HasFiles)
{
foreach (HttpPostedFile uploadedFile in UploadImages.PostedFiles)
{
uploadedFile.SaveAs(System.IO.Path.Combine(Server.MapPath("~/Images/"), uploadedFile.FileName));
//listofuploadedfiles.Text += String.Format("{0}<br />", uploadedFile.FileName);
}
}
}
}
}
My .aspx code:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="TestFileUpload1.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Test web site</title>
<script src="Scripts/jquery-1.11.0.js"></script>
<script src="Scripts/jquery.mobile-1.4.5.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div>
<asp:FileUpload runat="server" ID="UploadImages" AllowMultiple="true" />
<asp:Button runat="server" ID="uploadedFile" Text="Upload" OnClick="uploadFile_Click" />
<asp:Label ID="listofuploadedfiles" runat="server" />
</div>
</div>
</form>
</body>
</html>
whenever I try to upload a file, I get "False" for UploadImages.HasFiles.
Above is full working example.
As soon as I remove one of these script tags :
<script src="Scripts/jquery-1.11.0.js"></script>
<script src="Scripts/jquery.mobile-1.4.5.js"></script>
my code starts working and I get "true" for UploadImages.HasFiles when I try to upload a file.
I am using .net framework 4.7.2
I need to keep these two script tags in my code because of the GUI and this is an old application where these tags are used in all the pages.
I also tried to wrap the control in a update panel and that didn't work either. below is the changed .aspx page. although, I want my original code to work. I don't want to use ajax, but I just tried to use it because it is suggested as one of the solution
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="TestFileUpload1.WebForm1" %>
<%--<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp"%>--%>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Test web site</title>
<script src="Scripts/jquery-1.11.0.js"></script>
<script src="Scripts/jquery.mobile-1.4.5.js"></script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<div>
<div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:FileUpload runat="server" ID="UploadImages" AllowMultiple="true" />
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="uploadedFile" />
</Triggers>
</asp:UpdatePanel>
<asp:Button runat="server" ID="uploadedFile" Text="Upload" OnClick="uploadFile_Click" />
<asp:Label ID="listofuploadedfiles" runat="server" />
</div>
</div>
</form>
</body>
</html>
below is the image of false value that I am getting in code behind:
Any help will be highly appreciated.
All I had to do is put data-ajax ="false" in form tag and that fixed the issue.
<form id="form1" runat="server" data-ajax ="false">
Use a update panel and wrap your controls inside it. Then add the button controlID as a trigger (be sure its a PostBackTrigger) to the update panel. To test be sure to put a break point on the uploadFile_Click event so you can step through and see the values..
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:PostBackTrigger ControlID="btnSignaureOfRequestor" />
</Triggers>
<ContentTemplate>
<table>
<tr> <td class="tdText" colspan="4">
<asp:FileUpload ID="fileUpload" runat="server" Width="50%" />
</td>
</tr>
<tr>
<td> <asp:Button ID="btnSignaureOfRequestor" runat="server" Text="Submit Request" Visible="true" OnClientClick="return confirm('Are you sure you want to continue?');" OnClick="btnSignaureOfRequestor_Click" />
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
Try the below, removed allow multiple and add update mode conditional (see confirm case/syntax of these changes as I'm just writing it in notepad)
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<div>
<div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" updateMode="Conditional">
<ContentTemplate>
<asp:FileUpload runat="server" ID="UploadImages" />
<asp:Button runat="server" ID="uploadedFile" Text="Upload" OnClick="uploadFile_Click" />
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="uploadedFile" />
</Triggers>
</asp:UpdatePanel>
<asp:Label ID="listofuploadedfiles" runat="server" />
</div>
</div>

Set value in Parent Page from Modal Popup Extender

I am testing the ModalPopupExtender in a simple web application. The user should input a value in the modalpopup and then this value would be shown in the parent page after closing the modal popup.
I used this code for the design:
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:Button runat="server" ID="BtnOpenPopup" Text="Open Popup" />
<asp:Label runat="server" ID="lbl" ></asp:Label>
<asp:Panel runat="server" ID="PnlTest">
<asp:TextBox runat="server" ID="txtInput"></asp:TextBox>
<asp:Button runat="server" ID="BtnSubmit" Text="Submit" OnClick="BtnSubmit_Click" />
</asp:Panel>
<ajaxToolkit:ModalPopupExtender runat="server" TargetControlID="BtnOpenPopup" EnableViewState="true" OkControlID="BtnSubmit" PopupControlID="PnlTest" ></ajaxToolkit:ModalPopupExtender>
</div>
</form>
</body>
</html>
And this is my code behind:
protected void BtnSubmit_Click(object sender, EventArgs e)
{
lbl.Text = txtInput.Text;
}
This didn't work, I don't get any errors, but still the lbl isn't loaded with the user input.
Would appreciate if you can give me some insight on how this works.
Hello I guess that you have to add a script for the OnOkScript attribute, try this :
//......
//.......
<ajaxToolkit:ModalPopupExtender runat="server"
TargetControlID="BtnOpenPopup"
EnableViewState="true"
OkControlID="BtnSubmit"
PopupControlID="PnlTest"
OnOkScript="onModalOk();"> <!-- here is the tag you have to add to get it work -->
</ajaxToolkit:ModalPopupExtender>
</div>
</form>
<script>
function onModalOk()
{
document.getElementById("lbl").innerText = document.getElementById('txtInput').value;
}
</script>

Manually change part of an image URL

I am using an .aspx file along with a C#(aspx.cs) file. The goal is to enter a number in the text box and change a section of a photo's URL, so that when it's submitted it will bring up a different photo.
The .aspx code is:
<form id="form1" runat="server">
<form action="demo_reqquery.asp" method="get">
Enter Pic number: <input type="text" name="pnumber" size="20" />
<input type="submit" value="Submit" />
</form>
<div class="logo2">
<asp:Image ImageUrl="http://www.website.com/pic0001.jpg" runat="server" />
</div>
</form>
The user enters "pnumber" 0005 in the text box and submits. Then the 0001 in the URL is replaced with the 0005 entered bringing up photo: "http://www.website.com/pic0005.jpg"
If you are ok to change the elements of your form,
<form id="form1" runat="server">
<div>
<asp:TextBox ID="TextBox1" runat="server" />
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
<br />
<asp:Image ID="Image1" runat="server" />
</div>
</form>
Code behind would be
protected void Button1_Click(object sender, EventArgs e)
{
Image1.ImageUrl = "http://www.website.com/pic" + TextBox1.Text + ".jpg";
}

ASP.NET Server Controls Showing Out Of Context Msg

I was working with this simple web page and happened to put some 's to correct the styling of my page and suddenly when got back to programming in the .cs file, things are strange. All the code is showing a similar error msg:
Error 2 The name 'TextBox1' does not exist in the current context d:\ADO_NETprojects\mywebsite\Default2.aspx.cs
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" `enter code here`Inherits="Default2" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div runat="server">
<div>
<asp:ListBox ID="ListBox1" runat="server" AutoPostBack="True"
onselectedindexchanged="ListBox1_SelectedIndexChanged" Width="179px" style="margin-left:100px; margin-bottom:20px;">
</asp:ListBox>
</div>
<hr/>
<div>
ListBoxItems
<asp:TextBox ID="TextBox1" runat="server" style="margin-left:20px; margin-top:20px;"></asp:TextBox>
</div>
<div>
<asp:Button ID="Button1" runat="server" onclick="Button1_Click"
style="height: 26px; margin-left:100px; margin-top:15px;" Text="ListsBoxItems" />
</div>
<hr/>
<div>
DeleteItems:
<asp:TextBox ID="TextBox2" runat="server" style="margin-top:10px; margin- left:25px;"></asp:TextBox>
</div>
<hr/>
<div>
<asp:DropDownList ID="DropDownList1" runat="server"
style="margin-top:20px; margin-left:100px; width:200px;"
AutoPostBack="True" onselectedindexchanged="DropDownList1_SelectedIndexChanged">
</asp:DropDownList>
</div>
<div>
DropDownList:
<asp:TextBox ID="TextBox3" runat="server" style="margin-left:2px; margin-top:15px;"
AutoPostBack="True"></asp:TextBox>
</div>
<hr/>
</div>
</form>
</body>
</html>
right-click on the aspx file, then choose "convert to web application" and then, the designer.cs file is regenerated

Dropdownlist selectedindexchanged event is not firing

Simply I have a Dropdownlist with RequiredFieldValidatior in UpdatePanel on a page,
I have enabled autopostback for the dropdownlist.
The problem is that Dropdownlist selectedindex event is not firing.
This unexpected behavior happens when I validate the page and ant error occurs.
I searched a lot but unable to find the solution
my code is as follows:
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_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></title>
<script type="text/javascript">
function ValidateMe() {
if (Page_ClientValidate("vgOption")) {
alert("valid");
}
return false;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="smMain" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="pnlMain" runat="server" ChildrenAsTriggers="true">
<ContentTemplate>
<table border="1" cellpadding="5" cellspacing="0">
<tr>
<td>
Option:
</td>
<td>
<asp:DropDownList runat="server" AutoPostBack="true" ID="Opt" OnSelectedIndexChanged="Opt_SelectedIndexChanged" ValidationGroup="vgOption">
<asp:ListItem Text="--Select Option--" Value="0" />
<asp:ListItem Text="Upload" />
<asp:ListItem Text="Download" />
</asp:DropDownList>
<asp:RequiredFieldValidator ID="rfv" runat="server" ControlToValidate="Opt" Display="None" InitialValue="0" ValidationGroup="vgOption" ErrorMessage="Please select an option"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
Postback:
</td>
<td>
<asp:Label Text="" ID="lblMessage" runat="server" />
</td>
</tr>
<tr>
<td>
</td>
<td>
<input type="button" onclick="return ValidateMe();" value="Test" title="Test" />
<asp:ValidationSummary ValidationGroup="vgOption" runat="server" ShowMessageBox="true" ShowSummary="false" DisplayMode="List" />
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
Codebehind:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Opt_SelectedIndexChanged(object sender, EventArgs e)
{
lblMessage.Text = "Autopostback: " + DateTime.Now.ToString();
}
}
Steps to repopulate the issue:
1. Click first option in dropdown
2. click on submit button
3. change dropdownlist value (this should fire selectedindex changed event, but it doesn't)
PS: I do not want to postback to happen when the submit button is clicked that is why I added <input> instead of asp.net button,
even if I add asp.net button it doesnt work
Added Page_BlockSubmit = false; in the JS code which was preventing the postback...
<script type="text/javascript">
function ValidateMe() {
if (Page_ClientValidate("vgOption")) {
alert("valid");
}
Page_BlockSubmit = false;
return false;
}
</script>
Reference: http://www.techques.com/question/1-2083929/Dropdownlist-doesn%27t-postback-after-Page_ClientValidate%28%29
replace
<input type="button" value="Test" title="Test" runat="server" validationgroup="vgOption"/>
with
<asp:Button ID="btn" runat="server" Title="Test" Text="Test" ValidationGroup="vgOption" OnClientClick="return ValidateMe()"/>
the issue is solved.
Add property ViewStateMode="Enabled" and EnableViewState="true"
in drop DropDownList
For more details click here
On clicking submit button, if page validation returns false and then changing the drop-down's selected-index will not work for first time. Because on submitting the form it will do Form validation.
If Validation returns false [indicates not to submit the Form], then you can can’t go to server side code.
Since you have used “SelectedstateChanged” event for the Dropdown, the code inside the event handler function will not execute after form validation is returned as false.
So to handle this problem, add onchange="Page_BlockSubmit = false;" :
<asp:DropDownList runat="server" AutoPostBack="true" ID="Opt" OnSelectedIndexChanged="Opt_SelectedIndexChanged"
CausesValidation="false" ValidationGroup="none" onchange="Page_BlockSubmit = false;">
<asp:ListItem Text="--Select Option--" Value="0" />
<asp:ListItem Text="Upload" />
<asp:ListItem Text="Download" />
</asp:DropDownList>
Reference Link http://burnignorance.com/asp-net-developer-tips/dropdownlist-validation-problem-in-asp-net/

Categories

Resources