What I want to do is very simple: I want to create a form using Code Igniter's form helper and place other buttons (aside from the submit button) within the form. Let me illustrate using this snippet (not my actual form):
<?php echo form_open('client/send_message'); ?>
<input type="text" name="message" required />
<button class="btn btn-primary btn-block">Send</button>
<button class="btn btn-default btn-block" data-toggle="modal" data-target="#my_modal">Send Email</button>
<?php echo form_close(); ?>
The second button Send Email is supposed to open a modal. The problem is this, clicking the Send Email button also processes the form. So it appears you cannot have more than one button within the same form. I know I can have the Send Email button outside the form but my original form has several buttons in different places within the form and placing them outside the form will break the design. I also know that I can use <input type="button"> within a form, but I really want to know the reason for this behavior and if there's a solution to it.
Thanks!
Hope this will help you :
change the type of button form submission change to submit
<?php echo form_open('client/send_message'); ?>
<input type="text" name="message" required />
<button type="submit" class="btn btn-primary btn-block">Send</button>
<button type="button" class="btn btn-default btn-block" data-toggle="modal" data-target="#my_modal">Send Email</button>
<?php echo form_close(); ?>
It would be better to use the a tag for this purpose.
<?php echo form_open('client/send_message'); ?>
<input type="text" name="message" required />
<button class="btn btn-primary btn-block">Send</button>
Send Email
<?php echo form_close(); ?>
<input type="button"/>
This will not submit the form, as we have specified it to act as a button only.
<input type="submit"/>
This will submit the form, as we have specified it to act as a button to submit a form.
Related
how can i remove disabled attribute from continue button when submit button is clicked or form submitted, it removes the disabled attribute from continue button when submit is clicked. but the problem is when you click on submit button it refreshes the pages so continue button again rollbacked to disabled state:
this is my view
<?php echo form_open('admin/requests/approve_request/'.$this->uri->segment(4)); ?>
<div class="form-group">
<label for="pending_reason">Note</label>
<textarea class="form-control" name="pending_reason"rows="6">
<?php echo set_value('pending_reason'); ?>
</textarea>
<?php echo form_error('pending_reason'); ?>
</div>
<button type="submit" class="btn btn-success" value="submit" id="submit" disabled>Submit</button>
</form>
<button type="button" class="btn btn-success" id="continue" disabled>Continue</button>
an my js is
<script>
$("#submit").click(function() {
$("#continue").removeAttr('disabled', true);
});
});
</script>
Take off the type="submit" property and that should fix your problem.
This question already has answers here:
<button> vs. <input type="button" />. Which to use?
(16 answers)
Closed 5 years ago.
I have this HTML
<div class="btn-group">
<input type="button" name="meat" class="btn btn-default active" value="Both">
<input type="button" name="meat" class="btn btn-default" value="Red">
<input type="button" name="meat" class="btn btn-default" value="White">
<input type="button" name="meat" class="btn btn-default" value="None">
</div>
This with addition os some css gives this resoult:
I use this code to only allow one active:
$(".btn-group > .btn").click(function(){
$(this).siblings().removeClass("active");
$(this).addClass("active");
});
But it is just visual, and when I try to input vía php POST (within a form) I don't get nothing.
If i change to type=radio, the PHP works fine, but it is uglier.
¿Any magical idea to make it work keeping it fancy?
The php code for testing is:
<html>
<body>
MegaUltraTest <?php echo ($_POST["meat"]); ?>
</body>
</html>
Thank you.
These buttons inside 'btn-group' div, aren't doing anything useful, apart from just displaying some buttons on the screen. They are not aware of any 'selected' property (in order for the selected value to be submitted).
Buttons are not meant to act like radio buttons, checkboxes etc. Their purpose is to perform an action when they are clicked.
So what i recomend is to forget about button group and just add checkboxes. If you are concerned about the styling, just add this very useful library (http://icheck.fronteed.com/). I think line skin will be great for you.
If you really want these buttons, you should write some js code (preferably jquery) and on the click event, store the selected value(s) in a hidden input that will get submitted. See here: Change a hidden input's value with jquery/javascript
Source : Send Bootstrap Button-Group value in a form with Get or Post
by nkwinder
You can check if $_POST['meat'] exists and check if the value is equal to it:
Implement it like this:
<div class="btn-group">
<input type="button" name="meat" class="btn btn-default <?= isset($_POST['meat']) && $_POST['meat'] === 'Both' ? 'active' : ''; ?>" value="Both">
<input type="button" name="meat" class="btn btn-default" value="Red">
<input type="button" name="meat" class="btn btn-default" value="White">
<input type="button" name="meat" class="btn btn-default" value="None">
</div>
I'm wanting to use a button element rather than input on the woocommerce login form, purely for styling reasons. So rather than
<input type="submit" class="btn btn-outline-primary" name="login" value="Login" />
I want to use
<button type="submit" class="btn btn-outline-primary">Login</button>
This doesn't work though and I've no idea why.
Just found it out the button element need the value setting the same as the input i.e.
<button type="submit" class="btn btn-outline-primary" name="login" value="Login">Login</button>
I have implemented a working Modal form using HTML, Bootstrap CSS and PHP, which displays information about a document. In the footer of the Modal I have a 'Delete Document' button which should post to the same page (index.php). The form doesn't react to the submit button.
Reading up on the subject a lot of people are using AJAX to submit from a Bootstrap Modal. This seems unnecessary? Do I really need to implement a JSON post in AJAX just to submit this Modal?
The code:
<div class="modal-footer">
<form action="index.php" method="post">
<input type="hidden" name="DocumentID" value="<?php echo $row['DocumentID']; ?>" />
<input type="hidden" name="top-search" value="<?php echo $_POST['top-search']; ?>" />
<button type="submit" name="deleteDocument" class="btn btn-w-m btn-danger" onclick="return confirm('Are you sure you want to delete this Document?')">Delete</button>
</form>
<button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
</div>
I have an example where a Modal submits successfully although to a different page using a similar method but using target="_blank"
Its not onclick - but onClick.
Also, you need to place the scripts inside {}. The following code should work.
/*
* A simple React component
*/
class Application extends React.Component {
render() {
return (<div class="modal-footer">
<form action="index.php" method="post">
<input type="hidden" name="DocumentID" value="<?php echo $row['DocumentID']; ?>" />
<input type="hidden" name="top-search" value="<?php echo $_POST['top-search']; ?>" />
<button type="submit" name="deleteDocument" class="btn btn-w-m btn-danger" onClick={ function() {
return confirm("Yes/No?");
}}>Delete</button>
</form>
<button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
</div>);
}
}
/*
* Render the above component into the div#app
*/
React.render(<Application />, document.getElementById('app'));
I have never really used radio buttons before. So what I am trying to achieve is, using two radio buttons 'Public' and 'Private'. This is for the user's profile. My HTML code for the buttons is;
<div class="btn-group" data-toggle="buttons-radio">
<button type="button" class="btn btn-primary" id="privacy" name="privacy" value="0">Private</button>
<button type="button" class="btn btn-primary" id="privacy" name="privacy" value="1">Public</button>
</div>
As for the PHP, I'm not sure how to get the value and store it. Any help is appreciated!
Use a form.
<form method="get" action="yourscript.php">
<input type="radio" id="private" name="privacy" value="0">
<label for="private">Private</label>
<input type="radio" id="public" name="privacy" value="1">
<label for="public">Public</label>
<input type="submit" value="Save">
</form>
Change your buttons to input elements, which, together with the form, provide a HTML native way to send data to a script without the need for Javascript (although you can use Javascript to enhance the usability later on).
Using the label tag, you can assign a text to a radiobutton. This allows this text to be clicked as well, and it also provides better support for screen readers, because they can actually see which text belongs to the radiobutton.
An id needs to be unique, so I changed it to private and public. The ids are also used to link the label to.
The name determines by which name the value is sent to your script.
In PHP, you can use the superglobal $_GET. $_GET['privacy'] will contain '0' or '1' depending on the choice made. If the method of the form was post, you could use the superglobal $_POST instead, or you can use $_REQUEST, which contains values from either, so in that case your script doesn't care whether the values were send in the url (get) or in the chunk of invisible post data that is sent along with the request.
change type to radio and donot use the same id for morethan one element id is supposed to be unique
Also when you post the form type=button values will not be passed with the form
<div class="btn-group" data-toggle="buttons-radio">
<input type="radio" class="btn btn-primary" name="privacy" value="0"/>Private
<input type="radio" class="btn btn-primary" name="privacy" value="1"/>Public
</div>
assuming its posted on $_POST['privacy'] should contain either a 1 or a 0
also dont use an ID twice - they are supposed to be unique
You don't have form and submit button.
HTML page:
<div class="btn-group" data-toggle="buttons-radio ">
<form name="privacyForm" action="action.php" method="post">
<button type="radio" class="btn btn-primary" name="privacy" value="0">Private</button>
<button type="radio" class="btn btn-primary" name="privacy" value="1">Public</button>
<input type="submit" value="Submit">
</form>
</div>
action.php
<?php
echo $_POST['privacy']; // should be 0 or 1
?>
i have assumes that your form is something as follows.
<form name="sample" action="form_submit.php" method="POST">
<div class="btn-group" data-toggle="buttons-radio">
<input type="button" class="btn btn-primary" id="private" name="privacy" value="0">Private</input>
<label for="private">Private</label>
<input type="button" class="btn btn-primary" id="public" name="privacy" value="1">Public</input>
<label for="public">Public</label>
</div>
<input type="submit" name ="submit" value ="Submit"/>
</form>
you can use the following code inside the action (form_submit.php) to get the selected radio button value.
form_submit.php
<?php
$selected_radio = $_POST['privacy'];
print $selected_radio;
?>
make sure that you are not duplicating the IDs because they should be unique.