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.
Related
I'm building a form consisted of button. I want to get value from a highlighted button being sent to a parameter when submit button is clicked, but the problem is I only found a way to sent value from a radio button. Is there any equivalent way to do this?
I know this is only applicable for radio button, so I'm searching an equivalent queryselector that will give exact action like code below but for button
document.querySelector('input[name=customButton]:checked').value
<button type="button" class="btn" id="customButton1" name="customButton" value="1">
<label for="customButton1">Excellent</label>
<button type="button" class="btn" id="customButton2" name="customButton" value="2">
<label for="customButton2">Not good</label>
You cannot convert a radio directly to a button like you did. The HTML is not valid
You can style a radio like a button or do this
document.getElementById("myForm").addEventListener("click",function(e) {
const tgt = e.target.closest("button")
if (tgt.matches(".customButton")) document.getElementById("customButton").value = tgt.value
})
<form id="myForm">
<input type="hidden" name="customButton" id="customButton" value="" />
<button type="button" class="btn customButton" value="1">Excellent</button>
<button type="button" class="btn customButton" value="2">Not good</button>
</form>
do you have some tips how to put buttons values to the Django sqlite database?
I have a page with some buttons with theirs values and some final button, which would send the buttons values to the database after the final button click.
Thanks.
Here is HTML intention:
<body>
<div class="row">
<form action="" method="post">
<div class="col-md-4">
<button type="button" class="btn btn-primary btn-lg overflow-hidden" value="1">Example1</button>
</div>
<div class="col-md-4">
<button type="button" class="btn btn-primary btn-lg overflow-hidden" value="2">Example2</button>
</div>
<div class="col-md-4">
<button type="button" class="btn btn-primary btn-lg overflow-hidden" value="3">Example3</button>
</div>
</div>
<input type="submit" value="Send to database">
</form>
</body>
class ValuesButtons(models.Model):
value = models.CharField(max_length=100, verbose_name="Value")
For Example: user clicks on example 1, next on Submit and it will send to database as value 1
If you are trying to submit the values in your buttons to your django database, you would have to first change your buttons by adding a name to them like this:
<button type="button" class="btn btn-primary btn-lg overflow-hidden" value="1" name="btn-1">Example1</button>
then inside your view, you could check to see if the button was pressed and there is a value in POST. Also, this won't work if your value is "0":
if (request.method == "POST):
if (request.POST.get('btn-1', False)):
new_value_button = ValueButtons(value=request.POST.get(
'btn-1'))
new_value_button.save()
This will get and save the values of the specific button pressed.
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=''
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.
Button group is not working as it should, the problem is if the "ON" is selected, it should not be selected again, but the problem is even the "ON" button is selected I am able to select the ON button again.
How can I stop my button to stop any action when the button is already selected.
This is my code for my button group:
<form action="myclass.php" method="post">
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-default btn-xs myOnbutton">
// myOnbutton is the button name
<input type="radio" autocomplete="off"> ON
</label>
<label class="btn btn-default btn-xs myOffbutton">
// myOffbutton is the button name
<input type="radio" autocomplete="off"> OFF
</label>
</div>
</form>
Do anyone knows where I am making the mistake, so it is selecting the button again.
This is basic HTML. It has nothing to do with bootstrap, you just need to add names to the checkboxes so you cant select both.
<label class="btn btn-default btn-xs myOnbutton">
<input type="radio" autocomplete="off" name="switch"> ON
</label>
<label class="btn btn-default btn-xs myOffbutton">
<input type="radio" autocomplete="off" name="switch"> OFF
</label>
if you want to disable the groups after first selection,you should use jquery like Plunker :
$(".btn-xs :radio").click(function(){
$(".btn-xs :radio").attr("disabled", true); //Disable all with the same name
});
and if you want to disable selected radio button only,Plunker :
$(".btn-xs :radio").click(function(){
$(this).attr("disabled", true); //Disable all with the same name
});