Wrong button executes the method="post" - post

How do I prevent "button1" from executing the emailform.php action?
I have three buttons on my page; two of which are supposed to just make sure the text boxes are not blank and the third one is a "submit" button that is supposed to email me the form results via a emailform.php action. The problem is that when I click on button 1 to validate the text boxes, it does that correctly but then tries to email the form.
<form name="surveyform" action="/emailform.php" method="post">
<button id="button1" onclick="return validate_question1()">Go to question 2</button>
<button id="button2" onclick="return validate_question2()">Go to question 3</button>
<input name="submit" value="submit" class="submit" type="submit" />

Try this -- set the type:
<button type ="button" id="button1" onclick="return validate_question1()">
Might need to see the onclick function.

Related

Angular Material: Weird suffix fucntionality

So I stumbled upon a weird one...
I am using angular material's form field component to create my forms...
I noticed that if I use a button inside the mat input field as matSuffix, if I try to submit the form from another field (pressing enter for example)... that field get's the focus and the button (suffix) gets clicked...
Even wrapping the angular material's example and wrapping it in a form I get the same:
https://stackblitz.com/edit/angular-frc7tj?file=app/form-field-prefix-suffix-example.html
<div class="example-container">
<form>
<mat-form-field>
<input
matInput
placeholder="Enter your password"
[type]="hide ? 'password' : 'text'"
/>
<button
mat-icon-button
matSuffix
(click)="hide = !hide"
[attr.aria-label]="'Hide password'"
[attr.aria-pressed]="hide"
>
<mat-icon>{{hide ? 'visibility_off' : 'visibility'}}</mat-icon>
</button>
</mat-form-field>
<mat-form-field>
<input
matInput
placeholder="Amount"
type="number"
class="example-right-align"
/>
<span matPrefix>$ </span>
<span matSuffix>.00</span>
</mat-form-field>
</form>
</div>
Just type something into the first (password field) and then click into "amount" field and press enter, observe what happens
the first one gets the focus and the button suffix is clicked....
how can I prevent this behaviour and actually enforce the normal, expected one (form submission on enter key)?
Just add type="button" to buttons inside the form. By default, type="submit" is using and you are trying to submit the form by pressing Enter key. See StackBlitz.

How to validate Form only on submit in Angular Dart?

I am using the Angular Component library which includes material-input. Is there a way to disable input auto validate when changing or emptying the material-input? Meaning that I want to only validate the form upon submit.
Plus the onSignInPressed() function is not getting triggered on submit despite that the material-button is of type submit.
<div class="container">
<form (ngSubmit)="onSignInPressed()" #signInForm="ngForm">
<div>
<material-input
floatingLabel type="email"
label="E-mail"
[(ngModel)]="email"
ngControl="email"
required></material-input>
</div>
<div>
<material-input
floatingLabel type="password"
label="Password"
[(ngModel)]="password"
ngControl="pass"
required></material-input>
</div>
<div class="w-100">
<material-button class="mx-0 btn-primary w-100 margin-zero" type="submit"
[disabled]="!signInForm.form.valid">
Sign In
</material-button>
</div>
</form>
</div>
You can try to use a different value accessor on the material-input, however you won't be able to validate the form on submit.
With changeUpdate, validation will be triggered on blur or when press ENTER
<material-input changeUpdate [(ngModel)]="value"
Docs
About the material-button, there is an issue on github with a hacky solution.
You can also try to add an hidden input
<input type="submit" hidden />

How to access to the new page with form and target="_blank" through capybara

I am trying to scrape this page with capybara + poltergeist.
<form action="/agency/advertiser/login" method="POST" role="form" target="_blank">
<input type="hidden" name="csrfToken" value="token"/>
<input type="hidden" name="account_id" value="id">
<input type="submit" value="login" class="btn btn-warning">
</form>
I could access to the element below, and tried click.
<input type="submit" value="login" class="btn btn-warning">
However, I can't access to the new page that opens after the click. How can I do that?
You need to tell Capybara you want to work in the new window. You do that by getting a handle to newly opened window and then using within_window or switch_window.
new_window = page.window_opened_by do
# perform whatever action causes the new window to open
page.find('form').click_button
end
page.within_window(new_window) do
# perform actions in the new window
end
# context returned to the original window
...

Rails - raw() removing FORM from content field data

I have a text field that stores page content created with a WYSIWYG HTML Editor.
Text field (content):
<form accept-charset="UTF-8" action="/myaction" method="post">
<input name="myaction[product]" type="hidden" value="Other" />
<input name="myaction[product]" type="hidden" value="Car" />
<input class="btn btn-primary" type="submit" value="Get a Car"/>
</form>
Show page
<% highlight(raw(#page.content),params[:search]) %>
The form does not seem to display or show the bootstrap form and button. It seems to be getting removed. What can I do to get the form to display?

how to call method in button onclick event in MVC 4?

I am developing a MVC application.
In Edit View, I want to have save/submit button and cancel button.
By default MVC given 'back to list' link.this link calls index() method.
Now, I want to call this index() method on Cancel button's Onclick event , how to do this ?
<input type="submit" value="Save" onclick="return validate();" id="btnSubmit" />
<input type="Button" value ="Cancel" onclick="Index()"style=" font-size:"1.2em"/>
What changes I have to make in above code?
You could use the window.location.href to redirect to a specified url:
<input type="Button" value="Cancel" onclick="window.location.href='#Url.Action("index")'" style=" font-size:"1.2em"/>
or simply use an anchor instead of a button:
#Html.ActionLink("Cancel", "Index")

Resources