I have a blade view. When the user select an item a modal view appears in the same HTML.
My modal have 3 buttons. Each button have to redirect by post request to specific functions in my controller.
CarsController
class CarsControllerextends Controller
{
index(){
...
return view('cars')->with(['car'=>$response]);
}
// execute when the user click on save button
save(Request $request){
...
}
// execute when the user click on delete button
delete(Request $request){
...
}
// execute when the user click on remove button
remove(Request $request){
...
}
}
Modal
<form role="form" method="POST" action="{{ url('/guardarTurno') }}">
{{ csrf_field() }}
<!-- 3 hidden inputs to save the id of the item that the user selected ... is the best way?-->
<input type="hidden" id="cancha" name="cancha" value="" class="form-control">
<input type="hidden" id="fecha" name="fecha" value="{{$agenda['fechaElegida']}}" class="form-control">
<input type="hidden" id="hora" name="hora" value="" class="form-control">
<button type="submit" class="btn btn-labeled btn-success button-infousuario">
<span class="btn-label"><i class="fa fa-check fa-fw"></i></span>
Save
</button>
<button type="submit" class="btn btn-labeled btn-warning button-infousuario">
<span class="btn-label"><i class="fa fa-exclamation-triangle fa-fw"></i></span>
Delete
</button>
<button type="submit" class="btn btn-labeled btn-danger button-infousuario">
<span class="btn-label"><i class="fa fa-times fa-fw"></i></span>
Remove
</button>
</form>
What I want is:
Save button make a post request to save() method
Remove button make a post request to remove() method
Delete button make a post request to delete() method
Each of three button need the same ids
Thanks!
You will have to make 3 different forms to send to 3 different functions.
After your Save button, close the first </form>.
Then start a new form for each of the remaining buttons (Delete & Remove). Each form will have a different action
<form action="/remove" method="post">
{{ csrf_field() }}
<input type='hidden' name='id' value='1' />
<button type='submit'>Remove</button>
</form>
Then the same for Delete
Don't forget to define routes for each of the action=''
Related
Here i'm using Angular2 i implement some html code for user access but why this data is not binding at Angular2 Source code side
Htmlcode
<form class="form-horizontal" novalidate [formGroup]="EmployeeForm">
<fieldset>
<div class="form-group" [ngClass]="{'has-error': (EmployeeForm.get('EmpName').touched ||
EmployeeForm.get('EmpName').dirty) &&
!EmployeeForm.get('EmpName').valid }">
<label for="name">Name</label>
<input type="text" class="form-control" formControlName="EmpName" [(ngModel)]="EmpName" />
<span>{{EmpName}}</span>
<span class="help-block" *ngIf="(EmployeeForm.get('EmpName').touched ||
EmployeeForm.get('EmpName').dirty) &&
EmployeeForm.get('EmpName').errors">
<span *ngIf="EmployeeForm.get('EmpName').errors.required">
Please enter your first name.
</span>
<span *ngIf="EmployeeForm.get('EmpName').errors.minlength || EmployeeForm.get('EmpName').errors.maxlength ||
EmployeeForm.get('EmpName').pattern">
The first name must be longer than A3 and max5 characters.
</span>
</span>
</div>
<button type="submit" class="btn btn-success" [disabled]="!EmployeeForm.valid" (click)="SaveDetails(EmployeeForm)">SaveDetails</button>
</fieldset>
</form>
component.ts
Here its pinging but data is not binding its showing as
zain = FormGroup {asyncValidator: null, _pristine: false, _touched: true, validator: function, _onCollectionChange: function…}
SaveDetails(Employee) {
}
try to change code from
<button type="submit" class="btn btn-success" [disabled]="!EmployeeForm.valid" (click)="SaveDetails(EmployeeForm)">SaveDetails</button>
to
<button type="submit" class="btn btn-success" [disabled]="!EmployeeForm.valid" (click)="SaveDetails(EmployeeForm.value)">SaveDetails</button>
Hi guys I am new to Angular JS(1.5). I have a form with two buttons, btn1 and btn2. I also have two text fields.
How can I make sure that btn2 should work only when both text fields have data in them.
Kindly help me out.
I am using this code,
<button type="button" class="btn btn-primary btn-s" ng-disabled="queryExecuting || !canExecuteQuery()" ng-click="executeQuery()">
<span class="zmdi zmdi-play"></span> BTN1 </button>
<input type="text" name="dbname" ng-model="dbname" required placeholder="dbname"/>
<input type="text" name="tname" ng-model="tname" required placeholder="tname"/>
<button type="submit" class="btn btn-primary btn-s" ng-disabled="queryExecuting || !canExecuteQuery()" ng-click="saveToGDPQuery(dbname,tname)">
<span class="zmdi zmdi-play"></span> BTN2 </button>
You could do below:
<button type="submit" class="btn btn-primary btn-s" ng-disabled="!dbname || !tname" ng-click="saveToGDPQuery(dbname,tname)">
If you have those fields within a form you could also potentially use $error.required flags.
And by the way, you should have a "dot" in your model.
Hey there I have now been look at this problem for 2h or even more so please dont mark this a dupplicate.
Here is the Problem, I have my ng2-bs3-modal that works fine even with my custom action on the Save Button. The problem is, if you press cancel and open it again the selected thing are still selected. I would like to get a new Form every time you open it and online I found a post saying that all there is to it is a simple Form.reset(). But I am unable to do so.
Here the Modal I made so far.
<modal #modalEventCreate>
<modal-header [show-close]="true">
<h4 class="modal-title">Create new event</h4>
</modal-header>
<modal-body>
<div class="form-group">
<form ngNoForm>
Event Type
<select class="btn btn-default align-center selection" [(ngModel)]="etype">
<option value="maintenance">Maintenance</option>
<option value="deactivate">Deactivate</option>
</select>
Server
<select class="btn btn-default align-center selection" [(ngModel)]="server">
<option *ngFor="let server of servers" [ngValue]="server.id">{{ server.name }}</option>
</select>
Start
<input class="form-control selection" id="datetimepickerStart" type="datetime-local" [(ngModel)]="sdate">
End
<input class="form-control" id="datetimepickerEnd" type="datetime-local" [(ngModel)]="edate">
</form>
</div>
</modal-body>
<modal-footer>
<button type="button" class="btn btn-default" (click)="postEvent()">Save</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
</modal-footer>
</modal>
I hope you can Help me or give me some helpfull information.
TY Bono
1.At the end of postEvent function add this.etype=null.
2.You manually create a onclick function for cancel event and add this.etype=null.
I have form, with two buttons:
<form action="/Book/Crud" method="post">
<input type="text" name="bookInput" />
<button type="submit">Save</button>
<button type="submit">Save and exit</button>
</form>
How can I pass to my controller, or, whatever, additional value, which depends on button?
<button type="submit" ?????? >Save</button> What should be here?
I am using Asp.Net Core, with this controller:
public IActionResult Crud(string bookInput)
{
//removed code for brevity
}
You can use jquery to solve the issue:
cshtml
<form action="/Book/Crud" method="post">
<input type="text" name="bookInput" />
<button type="submit" name="Submit">Save</button>
<button type="submit" name="SubmitAndExit">Save and exit</button>
</form>
jquery
$("form").submit(function () {
var btn = $(this).find("input[type=submit]:focus" );
var btnName = btn.attr('name');
var input = $("<input>")
.attr("name", "btnName").val(btnName);
$(this).append(input);
return true;
});
The answer of Bobby Jack is correct. I will elaborate on this answer in order to show how to access this input from within the controller. If you would use the following HTML:
<form action="/Book/Crud" method="post">
<input type="text" name="bookInput" />
<button name="action" value="save" type="submit">Save</button>
<button name="action" value="save-exit" type="submit">Save and exit</button>
</form>
You could reach the values: 'save' and 'save-exit' by defining another parameter in the controller like this:
// The parameter 'action' is what will contain the values specified in the button.
public IActionResult Crud(string bookInput, string action)
{
// Implementation
}
The name of the parameter needs to correspond to the value in the 'name' attribute of the form button (in this case 'action'). When the button is clicked, ASP.net will automatically assign the value of the 'value' attribute to the controller parameter. Or more specifically the controller parameter 'action' will have a value of 'save' or 'save-exit' retrieved from the attribute 'value'.
<form action="/Book/Crud" method="post">
<input type="text" name="bookInput" />
<button name="action" value="save" type="submit">Save</button>
<button name="action" value="save-exit" type="submit">Save and exit</button>
</form>
Like other inputs, the button can have a name and value attribute which will be submitted to your backend on submit. Only the button that was clicked will send its value. You need to use whatever mechanism you're using to access the POSTed variable named action (in this example). Then just switch on whether it's equal to save or save-exit and perform the relevant function.
add different names
<button type="submit" name="save">Save</button>
<button type="submit" name="saveExit">Save and exit</button>
Example from VB.net:
<asp:Button id="cmdKeyphraseAdd" runat="server" Text="Add Keyphrase" onclick="cmdKeyphraseAdd_Click"></asp:Button>
I'm trying to have a login and register button, when the login button gets clicked I want to specify it's a login action and when it's a register action I want to specify that in the URL. Is there some sort of attribute to define default get data which is always in there URL (plus the input data)?
This is my current code:
<form class="login-form" onsubmit="return validate();" method="get" action="php/login.php">
<input class="login-element credential" placeholder="Username" id="username" name="username"/>
<button class="login-element button" type="submit">Login</button>
<button class="login-element button" type="submit">Register</button>
</form>
<form class="login-form" onsubmit="return validate();" method="get" action="php/login.php">
<input class="login-element credential" placeholder="Username" id="username" name="username"/>
<button class="login-element button" name="login" type="submit">Login</button>
<button class="login-element button" name="register" type="submit">Register</button>
</form>
in login.php file your code goes like this.
if(isset($_POST['login']))
{
//your code goes here...
}
else
{
//your code goes here...
}
if(isset($_POST['register']))
{
//your code goes here...
}
else
{
//your code goes here...
}
You can add a 'data' attribute to each button and then change the 'action' of the form based on that. e.g:
<button class="login-element button" type="submit" data-action="login">Login</button>
<button class="login-element button" type="submit" data-action="register">Register</button>
You can 'grab' the data attribute in jQuery as follows:
$('.login-element').click(function(){
var action = $(this).date('action');
if(action == "register"){
// -- do register stuff
}else{
// -- do login stuff
};
});