I have an ASP.Net form which looks like the following when rendered (many lines of markup removed for brevity):
<form onsubmit="document.body.style.cursor='wait';showLoader();" action="mypage.aspx">
<!-- form elements and controls -->
<input type="submit" />
</form>
In mypage.aspx.cs's Page_Load I am doing:
if(Page.IsPostBack)
{
Foo();
} else {
Bar();
}
Quux();
Without modifying the HTML page using the Chrome Dev Tools, if I submit the form it executes Bar(). But If I removed or replaced the onsubmit attribute in the form with my own, ASP.Net thinks that the page is doing a post back and executes Foo().
I find this behavior weird because the inline JS code in onsubmit does not change anything related to the form submission. Its function is only to add a loading GIF while the form is reloading. Could there be something I am missing here?
Instead of adding a submit button, try adding a regular button, and call your gif functionality from it:
<input type="button" onclick="document.body.style.cursor='wait';showLoader();" value="Click Me" />
This will not post anything, which is what you want. <input type='submit'> will always cause a postback, unless you cancel it with JavaScript.
JSFiddle: http://jsfiddle.net/0gd8t7ew/
Related
I am bulding a WinForms application (VS2019, .NET 4.7.2) that wants to use CefSharp as its main UI (Cef 79.1.36+g90301bd+chromium-79.0.3945.130).
I have a simple form loaded from a local html file called form.html, where the relevant section (omitting most of the HTML boilerplate) looks like this:
<form method="POST">
<input type="text" name="Name" placeholder="Name" /><br>
<input type="text" name="Place" placeholder="Place" /><br>
<input type="submit" />
</form>
The form file is loaded via a custom scheme:
settings.RegisterScheme(new CefCustomScheme
{
SchemeName = "folder",
DomainName = "local",
SchemeHandlerFactory = new FolderSchemeHandlerFactory(
rootFolder: $#"{Application.StartupPath}\wwwroot",
hostName: "local",
defaultPage: "index.html")
});
The code that actually loads it is in Form1.cs and looks like this:
browser.Load("folder://local/form.html");
The form loads fine and is displayed as expected.
Now, when the user presses the Submit button, I want to intercept the submission and handle the submitted data (the values entered for Name and Place in this case) in my C# code. I don't want the form to actually submit to any web server - I just need to be able to get to the form data and deal with it in my C#/WinForms code.
I am not sure how to do that. Right now, after the Submit button is clicked, the form gets cleared (presumably reloaded from the same url), but I don't know where the submitted data went. Would appreciate any clues.
So I'm trying to write a bit of code that takes in a video from YouTube and adds it to a list. I'm doing this by passing in a url to a form and passing it to the controller. However, nothing happens.
View:
<form asp-action="addVideo" asp-controller="Video" validate="validate">
<input name="vidUrl" type="url" placeholder="Search for a video" required="required"/>
<input type="submit" value="Search"/>
</form>
Controller:
public ActionResult addVideo(string vidUrl)
{
//Do stuff...
return RedirectToAction("Index");
}
I have tried debugging addVideo, but submitting the form never triggered the breakpoint. The resulting url looks like http://(domain)/Video?vidUrl=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DdTDy8XVdRSk
Is there a reason that the view isn't calling the controller?
Update:
I know what's causing the issue. It's definitely the asp-action and asp-controller tags. I have a navbar up on top of my web page that previously was controlled by razor statements like #Html.ActionLink("Home","Index","Home"). I tried switching this link to a set of anchor tags with the same controller and action values, but it has no effect on the website. Is this an issue with packages?
Found it, html tag helpers are a core feature, which my ide Xamarin does not support nor does it multitarget. I guess switching back to Visual Studio will suffice.
Using ASP.NET, how do I make this button tag submit my ASP.NET form when clicked:
<button>Submit</button>
I'd like it to do a post back just like a regular asp.net server control button would work. I'd prefer a jquery way to do it if possible.
$('button').on('click', function(){
$(this).closest('form').submit();
});
On button click, it will find the closest form (which will be the parent) and submit it by passing the form to the action where you can access the values through your defined method; either get or post.
I think this is what you're asking.
You can either use:
<input type="Submit" />
Or using jQuery you can use:
$(function() {
$('button').on('click', function() {
$('form').submit();
});
});
you use javascript when you have links, or divs, or other elements that can not do post back.
In your case the <button>Submit</button> in html5 renders a submit button that if you click it, you just submit the form and that all you need.
The extra asp.net controls have some more functionality and communication with the code behind, but for the submit of the form, any submit button ether that one, ether the classic <input type="submit" value="Submit"> can do what you ask as they are.
When I use telerik radbutton
<telerik:RadButton ID="RadButton1" runat="server" Text="Stackoverflow"
Skin="Default" OnClientClicked="SaveIt()" CommandArgument="Edit">
</telerik:RadButton>
after refreshing page, always SaveIt() function starts to work.
But;
when I use button, it works only when user click it.
<button type="button" onclick="SaveIt()">Stackoverflow</button>
What is the difference between them?
Couple of things here. The difference between a RadButton and a normal HTML button is as follows:
When a RadButton is used, the client side HTML generated is as follows:
<a id="btnStandard" class="RadButton RadButton_Office2010Silver rbSkinnedButton"
href="javascript:void(0)">
<input class="rbDecorated" type="submit" name="btnStandard_input"
id="btnStandard_input" value="Standard Button" />
<input id="btnStandard_ClientState" name="btnStandard_ClientState"
type="hidden" />
</a>
As you can see, the type generated is of "Submit" - which means it will submit the form to the server. So if you refresh it will try to resend the form again.
what i am failing to understand is - have you used ajax panel. Because if you have used ajax panel, the button click would trigger an ajax posting to the server and when you refresh the page its as if its a first time and not a postback.
Where as the normal html is not meant for form submits. Its just used to trigger a click event on the client side.
Having said that - the signature for OnClientChecked is as follows:
OnClientChecked="<js function name>"
NOTE: you should be providing only the function name without parenthesis i.e. ( and ).
In your case since you provided the parenthesis - when the button gets initialized the client side functions associated with it are getting executed and you are having your Javascript code run at runtime.
So here is the right code for this:
<telerik:RadButton runat="server" Text="test" OnClientClicked="func" />
<script>
function func() {
alert("clicked");
}
</script>
Hope this answers your question.
Doesn't the RadButton have the onClick methods instead of OnClientClicked ?
Actually, I've run into this behavior also. Refreshing the page does imply a postback as the person who posted the alleged answer for this claims. The js function specified for the onclientclicked event is firing on the loading of the page. I noticed the answer simply re-stated the obvious and what the original poster had posted as the code that is not working and claimed it worked without addressing the issue of the function being fired on load and simply assumed a 'refresh' was equivalent to a postback.
I simply thought I'd address to fish for a valid analysis and to point out simply that if someone posts something and their friend promotes it as an answer, it doesn't mean it's right.
I am rendering out a ViewUserControl (.ascx file) in a view:
<% Html.RenderPartial("Comments", Model.Comments); %>
This ViewUserControl shows associated comments on an entry. I would like this control to render out a form as well, so users of my application can contribute.
How would you add a form to a ViewUserControl and handle it's postback?
Just add the form in there the same as you would on any page. In MVC, the form does not postback as such - it simply submits itself and its content (input controls) via HTTP Post to a URL.
Simply create an action in your controller (and hence a URL) which the form will post and do whatever activity is required there...
There is no postaback, like in standard asp.net, there can be only form tag that posts data to some url (controller/action).
Inside your partial user control, write:
<form action="controller/actionname" method="post">
<input type="text" name="inputText" />
<input type="submit" value="Post data to server" />
</form>
In MVC, only input type="submit" triggers form submit. In standard ASP.NET webforms, you can have many Linkbuttons, Buttons, ... but under cover, they all triggers this simple click on input type="submit" through javascript event. One form can post data to only one URL (controller/action), but that can be changed with javascript (as we can see in html source of 'old' asp.net webforms).
then, in controller you can handle post data:
[AcceptVerb(HttpVerb.Post)] // optionally
public ActionResult ActionName(string inputText) ...
Like others have answered already, you simply render a form and handle it's submit with an ActionResult.
For example, if your form (which could be rendered anywhere in your site) was submitting to http://www.yoururl.com/home/save, you would create an ActionResult method named save on the home controller to handle the submit (likely post/get method).