I have two form now which needs to submitted differently right now i want the both the forms to be submitted with single submit button.
<div class="row m-b-4">
<div class="col-md-12">
<div class="form-group label-static type-text" :class="{'has-error': errors && (errors.final_billing || errors.final_billing_was_added)}">
<label class="control-label" for="id_final_billing" v-show="_.isEmpty(billingInfo) || !billingInfo.has_close_out" v-cloak>
Final Billing <span v-show="_.isEmpty(billingInfo) || !billingInfo.has_close_out" class="req" v-cloak>*</span>
</label>
<div v-show="_.isEmpty(billingInfo) || !billingInfo.has_close_out" v-cloak>
<div class="radio" style="display: inline-block;">
<label>
<input type="radio" name="final_billing" :value="true" v-model="form.final_billing" />
<span class="circle"></span>
<span class="check"></span>Yes
</label>
</div>
<div class="radio m-l-4" style="display: inline-block;">
<label>
<input type="radio" name="final_billing" :value="false" v-model="form.final_billing" />
<span class="circle"></span>
<span class="check"></span>No
</label>
</div>
</div>
{% include "m_close_out_form.html" %}
{% include "a_close_out_form.html" %}
{% include "d_close_out_form.html" %}
when we select final billing one of these forms gets opened based on some condition
<button type="submit" form="entry" class="btn btn-primary btn-raised">Submit</button>
I have the below button in other html file
<button type="submit" form="close-out-form" class="btn btn-primary btn-raised">Approve</button>
So when i click on the Submit button with form="entry" i need to make submit on both the forms form="entry" and form="close-out-form"
Related
I have created a modal. Inside a modal is a form. I have used this modal in Two pages.
When i click on submit in the modal-form on the second page it redirects to the first page.
I don't want that to happen. I want it to redirect to its own page.
<form action="{{route('asd')}}" method="post">
<div class="form-group row">
<label for="procurement_name" class="col-md-3 col-form-label text-md-rigth">PROCUREMENT MODE
</label>
<input id="procurement_name" type="text" name="procurement_name" class="col-md-9 form-control" form="sub-form" required>
</div>
<div class="form-group row justify-content-around">
<button type="submit" class="btn btn-primary btn-block" form="sub-form" style="font-size: 25px;">SAVE PROCUREMENT MODE</button>
</div>
</form>
Try like this
just add one hidden input
<input type="hidden" name="redirectUrl" value="www.google.com">
and base upon that you can redirect from controller
<form action="{{route('asd')}}" method="post">
<input type="hidden" name="redirectUrl" value="www.google.com">
<div class="form-group row">
<label for="procurement_name" class="col-md-3 col-form-label text-md-rigth">PROCUREMENT MODE
</label>
<input id="procurement_name" type="text" name="procurement_name" class="col-md-9 form-control" form="sub-form"
required>
</div>
<div class="form-group row justify-content-around">
<button type="submit" class="btn btn-primary btn-block" form="sub-form" style="font-size: 25px;">SAVE
PROCUREMENT MODE</button>
</div>
</form>
inside Controller
retrun redirect($request->redirectUrl) // then you can redirect
Thanks Everyone but i have solve my problem..
switch ($request->redirectUrl){
case 'procurement':
return redirect(route('procurement.index'));
break;
default:
return redirect(route('purchaseOrder.create'));
break;
}
I have an html form using express-handlebars inside a loop that gets rendered a certain amount of times based off how many users there are assigned to a group.
So if there are 5 users the below code between the "#Each" gets loaded 5 times.
How do I structure this so that I can Post it back to node and write it to mongoDB in terms of what I use for the id and name.
I couldn't find anything related, if there's anything on here, please link it :)
<form action="/users/rsvp" method="POST">
{{#each docs}}
<div class="card border-secondary mb-3">
<div class="card-header"></div>
<div class="card-body">
<h4 class="card-title">{{this.name}}</h4>
<div class="form-check">
<input class="form-check-input" type="radio" value="1" id="{{this._id}}"
name="{{this._id}}">
<label class="form-check-label" for="{{this.id}}">
Attenting
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" value="0" id="{{this._id}}"
name="{{this._id}}">
<label class="form-check-label" for="{{this._id}}">
Not Attenting
</label>
</div>
<div class="form-group">
<label for="DietaryRequirements"></label>
<input type="text" id="DietaryRequirements" name="DietaryRequirements" class="form-control"
placeholder="Dietary Requirements" />
</div>
</div>
</div>
{{/each}}
<button type="submit" class="btn btn-primary btn-block">
RSVP
</button>
</form>
With your code, all the users' form are rendered within 1 <form>, which will cause a lot of duplicate fields on DietaryRequirements and of course the server cannot figure out which field is for which user. You can simply break it up so that each user has a separate , and pass the user's ID through a hidden input. E.g.:
{{#each docs}}
<form action="/users/rsvp" method="POST">
<!-- Your Form Content, name=attending and name=dietaryRequirements -->
<input type="hidden" value="{{this._id}}">
<button type="submit" class="btn btn-primary btn-block">
RSVP
</button>
</form>
{{/each}}
OR
If you really want a single form for the whole group of user, you can utilize the extended setting on body parser, which allows submission of nested object through HTML, in that case you write something similar to:
<form action="/users/rsvp" method="POST">
{{#each docs}}
<div class="card border-secondary mb-3">
<div class="card-header"></div>
<div class="card-body">
<h4 class="card-title">{{this.name}}</h4>
<div class="form-check">
<input class="form-check-input" type="radio" value="1" id="user-{{this._id}}-attending"
name="user[{{this._id}}][attending]">
<label class="form-check-label" for="user-{{this._id}}-attending">
Attenting
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" value="0" id="user-{{this._id}}-not-attending"
name="user[{{this._id}}][attending]">
<label class="form-check-label" for="user-{{this._id}}-not-attending">
Not Attenting
</label>
</div>
<div class="form-group">
<label for="user-{{this._id}}-dietary"></label>
<input type="text" id="user-{{this._id}}-dietary" name="user[{{this._id}}][dietaryRequirements]" class="form-control"
placeholder="Dietary Requirements" />
</div>
</div>
</div>
{{/each}}
<button type="submit" class="btn btn-primary btn-block">
RSVP
</button>
</form>
Notice the name s has a notation of a[b][c], and also the id and for should have unique pairings on each page which have been fixed as well.
If you have set body parser extended to true, you should get for req.body:
{
user: {
'10': {
attending: '1',
dietaryRequirements: 'Meaty'
},
'11': {
attending: '0',
dietaryRequirements: 'N/A'
}
}
}
i have a problem with angulare code. I have made a small form structure with ng reapet . When i removed one of element every element down of them are not show the "not valid" message . All up of them work fine but down of remove not showing info not given the false of this data-ng-show="Zhf.w{{key}}.$error.pattern" why ng show not taked false.
<form name="zhf" class="form-horizontal">
<div data-ng-repeat="(key, i) in vm.items.Info | limitTo: (vm.NumberOfDays)">
<div class="col-sm-3">
<input type="text" class="form-control" id="w{{key}}" name="w{{key}}" ng-model="vm.item[key].w" placeholder="0" ng-pattern="/^[0-9]{1,10}([,.][0-9]{1,2})?$/" required>
<p style="color: #a94442" class="text-danger" data-ng-show="Zhf.w{{key}}.$error.pattern">
<span>Not a valid number!</span>
</p>
</div>
<div class="col-sm-2">
<button type="button" class="btn btn-danger btn-sm " ng-click="vm.delete(key)">remove</button>
</div>
</div>
</form>
vm.delete = function(index) {
vm.items.Info.splice(index, 1);
vm.item.splice(index, 1);
vm.NumberOfDays -= 1;
}
I have updated your ng-repeat section to validate form and sample is HERE
<form novalidate="novalidate" name="inputValidate">
<div ng-repeat="field in fields.test">
<div style="width:600px">
<div ng-form name="validMe" style="width:58%;float:left">
<input id="input{{$index}}" name="input{{$index}}" type="text" ng-model="field.value" ng-pattern="/^[0-9]{1,10}([,.][0-9]{1,2})?$/" required>
<span style="color: #a94442" ng-show="validMe['input\{\{$index\}\}'].$error.pattern">Not a valid number!</span>
<span style="color: #a94442" ng-show="validMe['input\{\{$index\}\}'].$error.required ">Number Required!</span>
</div>
<div style="width:20%;float:left">
<input type="button" value="Remove" ng-click="delete($index)"/>
</div>
</div>
</div>
</form>
i'm working on ACTIVI in AngularJS.
I need to submit forms, so i created it with a submit button. The problem is that each submit button is a bit different (one is for text type form, another for enum type forms) and with new form the previously button is repeated twice.
As you can see this one is ok:
.
But the next form repeat the previously submit button:
This is the code in html
<div ng-controller="githubController3">
<div ng-controller="githubControllerForm1">
<div ng-controller="completeTaskAction">
<form ng-submit="submitForm()">
<div ng-repeat="x in names">
{{ x.name }}*
<div ng-if="x.id=='name'">
<input type="text" name="nome" ng-model="formData.properties[0].value" placeholder="{{x.name}}"> {{ value }} </input>
</div>
<div ng-if="x.id=='email'">
<input type="email" name="email" ng-model="formData.properties[1].value" placeholder="{{x.name}}"> {{ email }} </input>
</div>
<div ng-if="x.id=='income'">
<input type="number" name="numero" ng-model="formData.properties[2].value" placeholder="{{x.name}}"> {{ income }} </input>
</div>
</div>
</div>
</form>
<div ng-controller="completeTaskAction">
<form ng-submit="submitForm()">
<br>
<button ng-show="x.type==enum" type="submit" class="btn btn-success btn-lg btn-block">
<span class="glyphicon glyphicon-flash"></span>Submit!
</button>
</div>
</form>
</div>
</div>
<div ng-controller="githubControllerForm1">
<div ng-controller="completeTaskAction2">
<div ng-repeat="x in names">
<div ng-if="x.type=='enum'">
<!--/////////////////////////////////-->
<form ng-submit="submitForm2()">
<select ng-model="formData2.properties[0].value" ng-options="y.id as y.name for y in x.enumValues "></select>
<br>
<button ng-hide="x.type==enum" type="submit" class="btn btn-success btn-lg btn-block">
<span class="glyphicon glyphicon-flash"></span> Submit!
</button>
</div>
</div>
</form>
</div>
</div>
I tried (as you can see) with ng-show / hide / ng-if but doesnt work...
The first form is working fine because the button is outside ng-repeat. In the second case the submit button is inside ng-repeat.
am using summernote (wysiwyg) text editor. In previous editors value could be submitted using <textarea>. The current editor only use <div> element and if I replace the <div> class with <textarea> the editor stop to work.
The summernote code is
And my textarea is <textarea name='candidate_description'></textarea>
My form is submitted by JavaScript function
<form class="form-inline" role="form" action="#" method="post" accept- charset="utf-8" id="electroal" enctype="multipart/form-data">
<script>
function submitForm(action){
document.getElementById('electroal').action = action;
document.getElementById('electroal').submit();
}
</script>
<i class="fa fa-refresh"></i> <b>Refresh</b>
<button type="submit" onclick="submitForm('<?php echo $link[0]; ?>')"></i>Save</button>
<button type="submit" onclick="submitForm('<?php echo $link[1]; ?>')"></i>Cancel</button>
<div class="form-group input-xxx-x-wider">
<h6><strong>Description (500 max) <i class="glyphicon glyphicon-star red" ></i></strong></h6>
<div class="widget-main no-padding">
<div id="summernote"></div>
</div>
<textarea name="candidate_description"></textarea>
</div>
<div class="form-group input-x-wider">
<h6><strong>Status <i class="glyphicon glyphicon-star red" ></i></strong>| <i>Enable to use or Disable to use later </i></h6>
<label>
<input name="candidate_status" value="9" type="radio" checked="checked" class="colored-success">
<span class="text"> Enabled</span>
</label>
<label>
<input name="candidate_status" value="10" type="radio" class="colored-danger">
<span class="text"> Disabled</span>
</label>
</div>
</form>
I have zero knowledge in Jquery but I can try to catch up please help me.
->My main goal is to submit the the form with the text edited inside the <div id="summernote">some edited text here</div> element
I used function submitForm(action) to submit form because the links placed on onclick="submitForm('<?php echo $link[0]; ?>')" are dynamic and changes according to who login.
On web browser it looks like
<form class="form-inline" role="form" action="#" method="post" accept-charset="utf-8" id="electroal" enctype="multipart/form-data">
<script>
function submitForm(action){
document.getElementById('electroal').action = action;
document.getElementById('electroal').submit();
}
</script>
<button type="submit" onclick="submitForm('http://localhost/ANU_ELECTRAL1/candidate/save')">Save</button>
<button type="submit" onclick="submitForm('http://localhost/ANU_ELECTRAL1/candidate')">Cancel</button>
<div class="form-group input-xxx-x-wider">
<h6><strong>Description (500 max) <i class="glyphicon glyphicon-star red" ></i></strong></h6>
<div class="widget-main no-padding">
<div id="summernote"></div>
</div>
<textarea name="candidate_description"></textarea>
</div>
<div class="form-group input-x-wider">
<h6><strong>Status <i class="glyphicon glyphicon-star red" ></i></strong>| <i>Enable to use or Disable to use later </i></h6>
<label>
<input name="candidate_status" value="9" type="radio" checked="checked" class="colored-success">
<span class="text"> Enabled</span>
</label>
<label>
<input name="candidate_status" value="10" type="radio" class="colored-danger">
<span class="text"> Disabled</span>
</label>
</div>
</form>