I have an mvc generated form (#Html.BeginForm()) with button of type="submit" within bootstrap modal overlay.
<button aria-hidden="true" data-dismiss="modal" class="btn" type="submit">Close</button>
When I click the button - all it does is closes the modal.
Submit action (POST to the controller) is not performed.
You might have to remove the data-dismiss="modal" property since that triggers the Modal to close instead of doing a submit.
simply add <input type="submit" value="Close" class="btn" />
do this
#using(#html.BeginForm("ActionName","ControllerName"))
{
<input type="submit" value="Close" class="btn" />
}
Related
I have the following HTML where Address is shown using Kendo Window
<form id="myform">
<input id="firstName" class="form-control" />
<input id="lastName" class="form-control" />
<button id="btnOpenWindow" type="button" class="btn btn-info">Click Me To Edit Address</button>
#(Html.Kendo().Window()
.Name("mywindow")
.Title("My Window")
.Width(400)
.Visible(false)
.Modal(true)
.Content("<input id=\"address\" class=\"form-control\">")
.Draggable(false))
<button id="btnSubmit" type="submit" class="btn btn-info">Save</button>
</form>
<script src="~/js/test.js"></script>
test.js file
$("#btnOpenWindow").click(function () {
$("#mywindow").getKendoWindow().open().center();
});
ISSUE
Even though kendo window is defined inside the form it always renders at the end of the page just before body tag, along with its content. So address does not render inside the form. So when user clicks Save, the address information does not get submitted to server.
How do get kendo window's content render inside form?
I am trying to insert a form into my site.Master but when I debug it, it seems to have removed the form.
<form onsubmit="quoteMe(event)">
<div class="form-group" id="divQuotePriceBeforeBook">
<button class="btn btn-block btn-primary" id="quotemebutton" type="submit">Quote Now</button>
</div>
</form>
I can see that there is a server form wrapping the entire body, does this mean we can't have forms?
No you cannot do that using WebForms but there is always a work around.
Based off of your code it doesn't seem like you need a form for what you are trying to accomplish.
<div class="form-group" id="divQuotePriceBeforeBook">
<button class="btn btn-block btn-primary" id="quotemebutton" onclick="quoteMe()">Quote Now</button>
</div>
If you really do need the code to post back to the server, you would want to do something like this:
<div class="form-group" id="divQuotePriceBeforeBook">
<asp:Button id="quotemebutton" runat="server" CssClass="btn btn-block btn-primary" OnClientClick="quoteMe()" Text="Quote Now" />
</div>
I'm using bootstrap validator to validate the form in my react app, facing issues like the submit button is disabled but still clickable in the form, I want to make the button non clickable until the form gets validated. I added the disabled property but its not getting enabled once the form is valid.Below is my code.. Can anyone help here
<form data-toggle="validator" role="form">
<div className="form-group">
<div className="col-xs-5" id="form" style={{display:'none'}}>
{this.renderForm(this.props.fld_dtl_da)}
<button type="button" className="btn btn-default" onClick={this.ClearForm}>Clear</button>
<button type="submit" disabled='disabled' className="btn btn-primary" onClick={this.HandleClick}>Submit</button>
<br/><br/>
</div>
<div id="url" class="alert alert-info" style={{display:'none'}}>
<Confirmation message={this.state.message}/>
</div>
</div>
</form>
Using Laravel, I have a form and I want to include a "cancel" button that just redirects back to a different route. Since the button is within the form element, when clicked it attempts to submit the form. In the Laravel docs I don't see a good way to do this. Any suggestions or would using Javascript be best?
Thanks,
<div class="form-group pull-right">
<button class="btn btn-default btn-close">Cancel</button>
<button type="submit" class="btn btn-global">Register</button>
</div>
Though it's a very late answer, But it might help others.
You can just redirect back where you have come from. Simply use the following code.
Cancel
It will send you back where you have came.
<a> elements in bootstrap can have the btn class and they will look just like a button, so you can take the button out and just have cancel be a link:
<div class="form-group pull-right">
<a class="btn btn-default btn-close" href="{{ route('home') }}">Cancel</a>
<button type="submit" class="btn btn-global">Register</button>
</div>
it does not have to do with laravel. You can simple use formaction attribute
<input type=submit formaction="anotherpage">
<button class="btn btn-default btn-close" formaction="{{ route('home') }}">Cancel</button>
I have a anchor tag enclosing a button I want to redirect it to spring controller when click the button. The below code is working on chrome browser but it is not working in IE. could you please help me?
<spring:url value="/auth/userhome" var="homepage" />
<a href="${homepage}">
<button type="button" class="btn btn-primary cancel">
<spring:message code="button.cancel" />
</button> </a>
You can check this thread: Button inside of anchor link works in Firefox but not in Internet Explorer?
That will fix your problem:
<input type="button" onclick="javascript: location.href = 'http://www.stackoverflow.com';"/>