I have been trying to integrate the jquery file upload component into my project. Currently it works fine when there is only that component on the page.
The component uses the form tag as the drag and drop area on the page. This is an issue since there can be only one form tag in an asp.net web form page. In addition, the form tag defines the action that uploads the file.
This is how the form code looks like:
<form id="fileupload" action="api/FileHandler" method="POST" enctype="multipart/form-data">
I want this component to be in the middle of the page. How do I go about doing this?
Thanks.
EDIT: This is the file upload component!
I am using this example!
As the link that #MikeSmithDev suggested I changed the form tag into a div tag and that fixed it. It seems having a form and an action where not being used as a form. The JQuery code did the setup of the drag and drop area, setup the event, and raised the event based on the tag with the specified ID. So the form tag was not really necessary.
Related
I have a Master Page and a Content Page. I have Check In Check Out small form in Master Page and I have a Contact form in Content page. But while running the website, I am getting the error which says:A page can have only one server side form tag. When I remove the form tag from the Content Page. Then,it says the Textbox should be placed within a form tag. But I want both the forms,since both are necessary. So please help me so that I can have both the forms.
There can be only one <form> tag on the whole page, that is just how webforms work. In your case it is in the master page. The pages using the Master do not and should not have <form> tags.
But from your question it seems that you think you are using master pages, but are actually not. See this page as to how the .aspx pages are supposed to look with master and child pages.
https://learn.microsoft.com/en-us/aspnet/web-forms/overview/older-versions-getting-started/master-pages/creating-a-site-wide-layout-using-master-pages-cs
It is not possible to add more than one form in a single aspx file. Otherwise try to use iframe in that page.Inside the iframe we can use another aspx page.
I have an ASP.NET file upload control which sits as part of a form. The file upload control is on the content page while the form definition is on a master page across the site. I've added multipart/form-enc to the form on the master page.
I'm using jQuery to submit the form as I show a dialog box from jQuery UI.
When I post, no file is returned to the server. The file upload control has no file and HttpFileCollection is empty. How can I find the posted file?
Most dialogs take your content, wrap it, and place the result just before </body> in the page...this is a problem in ASP.Net because that's outside the <form></form>, it needs to be inside to be included in the POSTed data.
When you create the dialog, make it append inside the <form> when it finishes instead of the <body>, for example this is what you'd do with the jQuery UI dialog:
$("#myDiv").dialog({ ...options... }).parent().appendTo("form:first");
Now that it's been moved inside the <form>, it should post correctly.
I need to supply an html form (not a server form) for searching within an asp.net web-forms website. The form will post to another website where an indexed search is performed. Seeing as nested forms don't work well in asp.net, what is the simplest approach for this?
The nested form is a simple html form that performs a "get" against the search website, which I do not have programmatic control over.
Update: I resolved my issue by simply moving the server form to the appropriate place on the page, rather than having it surround the entire page. However, I'm still wondering how this would be handled if the html form needed to be placed physically between server controls (which require the server form).
However, I'm still wondering how this would be handled if the html form needed to be placed physically between server controls (which require the server form).
You can place controls on your page without requiring an HtmlForm.
In your case there's no issue declaring another form markup, but you could also just use some search control on your main form and make it issue a GET to that website.
Not only do nested forms "not work well," you basically can't have >1 form per page at all. The simplest approach is the approach you are forced to go with: write a page that only uses one <form runat="server"></form>. Since you need search functionality, is there no ASP.NET search box control that you could use?
Have a read here.
There are 4 workarounds:
Use an IFRAME
Force Submission to Navigate Using a GET Request
Dynamically Change the Form Action
Use a 3rd Party Form Handler
More details on http://www.revindex.com/Blogs/tabid/65/EntryID/21/Default.aspx
Nested forms don't work well in HTML full stop! You should never do it.
Perhaps you mean more than one form on page? Whilst it's true you can only have one form with runat="server", I can't see any reason why you couldn't have a standard form (not server form) that posted to another site at the same level (ie. not nested).
Try adding your HTML input elements to wherever you want the nested form to be. Then use JQuery to change the page form action to point to the external Website. The entire form is submitted, but with a different external Url. The minor downside is the values for all input elements on the page are posted, but most times that is not big deal.
(I only tried this using a POST, not a GET. This is basically Roman O's #3 workaround in more detail)
<div id="nested-form">
<input type="text" name="q">
<input name="searchbtn" value="Go" type="submit" class="search-button">
</div>
<script>
$(function() {
$("input.search-button").click(function() {
$('form').get(0).setAttribute('action', 'http://external.com');
});
});
</script>
maybe you try Server.Transfer() to your target page that do the search from a button for example!
I'm loading using $.load() a .aspx page on a div of a parent .aspx, let's say. When the content is loaded a new form is placed in the code, inside the aspnetForm. I've done this before in a very similiar way, but this time the submit button is submitting the new form to the ajax loaded page, not the aspnetForm parent page.
Edit:
More details
When the user choose a set of items from a list, they're loaded by ajax like this:
$("#gvContacts").load("MailingContacts.aspx?ids="+$("#filters").val() + "&removedContacts=" + $("#removedContacts").val() + "&action=<%=Convert.ToInt16(this.Action) %>", function());
MailingContacts is a aspx webForm with a GridView inside. When the .load puts the HTML on the div it goes like this:
<form id="form1" action="MailingContacts.aspx?ids=11&removedContacts=&action=2" method="post" name="form1">
<!-- GridView code -->
</form>
and for some reason, the Button that submits the page is using this new form instead of the original aspnetForm.
You're not allowed to have nested forms - if you add a new set of <form> tags inside the main parent form you'll end up in a world of pain.
Basically, you're bypassing the server-side validation of this by creating the nested form in the client side. I imagine that your submit button is then using the last form action it finds on the page, rather than the "parent" action.
You should either:
Load the JavaScript created form into a <div> outside of the main ASP.NET form control (you are allowed multiple forms on a page, just not nested).
Build your main form in such a way that it can handle the form contents of MailingContacts, and remove the Form tags from it.
Rather than returning a whole page of HTML including a GridView over AJAX, just return collection of user details, and render them into a list with jQuery, etc - you're sending a lot more data than you need to sending all that HTML.
This is because the action property set in the form tag has an value that tells it where to submit...in ASP.Net this by default is the URL of the page.
e.g. a form from my current project outputs like this:
<form name="aspnetForm" method="post" action="/Admin/Report/497" id="aspnetForm" />
How to add an IxQuick Search Box inside form tags "nested" in your asp.net form tags, complete with submit function.
Salve! I had a similar problem. I had an aspx page built on a master page which contained the asp.net form tag. Now, I wanted an Ixquick searchbox on that page, but I needed to enclose it inside of form tags to make it work; but, of course, you can't have nested form tags in the aspx page.
Here is how I solved my problem:
I created the entire searchbox in jquery and added it to the aspx page by using jquery to replace an empty div. Javascript runs in the client after the server serves up its code, thereby bypassing any issue with nested divs. This also avoids any issue with the master page's submit behaviour for the master page's form tag. You get your own form tag in the outputted html, and your own submit behaviour.
Put these two lines in your aspx page where you want your search box to appear.
<div id="search"></div>
<script type="text/javascript">AddSearchBox("#search");</script>
And in my .js file, I added:
function AddSearchBox(where){
var SearchingForm = "<form id='metasearch' name='metasearch' method='POST' accept-charset=' UTF-8' action='javascript:SearchBarSubmit()' ><input name='keyword' type='text' size='32' id='searchbox' /><input type='submit' value='WebSearch' id='searchbutton' /></form> "
$(where).html(SearchingForm);
return false;
}
function SearchBarSubmit(){
var searchquery = $('#searchbox').val();
location.href="http://ixquick.com/do/metasearch.pl?query=" + searchquery + "&cat=web&language=english&cmd=process_search&frm=sb&linkback_url=http://www.mywebsite.com&linkback_sitename=mySiteName";
return false;
}
Now, whenever someone types into my searchbox, it automatically runs the searchquery in IxQuick and displays the results - just like it would in a normal html form. And what's better, if they don't have javascript turned on, they don't get a broken searchbox, because they get no searchbox at all! I don't mind that, because I am adding the searchbox for the sake of being nifty.
If you use this code, make sure to change "www.mywebsite.com" to your own website, and make sure to change the linkback of "mySiteName" to your website's name.
It doesn't remove everything inside the 2nd form tag but just hides the and tags from the page
Any ideas and workaround?
Nesting of forms is not allowed in html. So you cant add another form inside the server-form.
But it is perfectly legal in ASP.NET to add get-forms outside of the server form.
I moved the nested form outside to solve this issue.
You cant have nested form tags. Either move to asp.net mvc if you want more control over the markup or consider not using asp.net server controls, this way you can include multiple form tags without having to ensure the controls are within a form tag with the runat server attribute but then you dont get the granular access in the code behind and have to start using the request.form colelction to retrieve the postback values.
.NET WebForms wraps the entire application in a <form> tag which can cause issues when adding additional <form> tags to the page. My coworker found a workaround for the nested form issue.
</form> <!-- This tag closes the WebForms form tag -->
<form action="/form/endpoint/foo">
...
</form>
By adding a solo closing </form> tag just above your custom form: WebForms will close it's wrapper form tag just before the start of your custom form so that you do not have a nested form block.
The reason ASP.NET encloses everything in a single form is so that when a postback occurs, the whole form is posted back to the server and you will have access over every element that is on the page.
That is you are able to modify the properties of elements (myTextbox.Text = 'Hello';) from the Code-Behind.