I have two forms that I'm calling from elements from the same controller, the second one is wrapped in an HTML table, I want to know how can I position my submit button at the bottom, after my table, because right now it's in the middle of the first form and the table.
I tried to assign the element in my controller and echo it in the view but it's still at the same position.
You can try something like that:
1 - for each form give a name like $this->setName('name1'); for example
2 - remove the submit button of your forms
3 - create a button in your view where you want:
<INPUT type="button" value="Validate" onClick="subForm()">
4 - In js create subForm() function:
<script>
function subForm(){
document.forms['name_of_your_form'].submit();
}
</script>
Of course, you can switch to the parameter name of the form you want to send.
Related
I'm having trouble getting the click event on a save button.
Let me explain.
I have a view index which displays a list of posts.
For each post, there is a button to add a comment.
When the user click on add a comment, I renderPartial a form where I have a input field for the comment and 2 buttons, 1 to save and another to cancel.
If I look the html through firebug, I can see
<input id="save" type="button" value="Save">
but if I right click on the html page and click on view page source, I cannot find the
<input id="save" type="button" value="Save">
that's why I suppose my jquery script doing things on button click
$('#save').click(function(e) .... does not work, I put a alert in the code to see whether I go inside the function but no alert message is displayed.
I must add that the click event function for the button to add comment is in the same script and works (when I look at html source code, I can see the id of add comment)
Do you have any idea of what could be the problem?
The reason is because the form is added after the original DOM load. You need to use the .on function and bind it to a DOM element that exists on original page load. So you could do this:
$('body').on('click','#save',function(e) {
//more code here
});
Or you need to bind the .click to #save after you have rendered the form on the page. You can't bind an action to an element before it exists in the DOM.
is it possible to keep the checked values of radio buttons should be same as we selected before when we move from current page to previous page in php?
please explain with sample code....
my dynamically generated radio button values are posted automatically when am going to next page in pagination before i submit the button.
i have 20 questions and answers per page.i need to evaluate them.i got answers in a array.
i cant get users selected radio button values while moving next or previous buttons with pagination,please help any one.
thanks in advance
You can do this with JavaScript or jQuery...
HTML
One of my favorite ways to do a multi-page form, if your pagination doesn't need to create new (copy/pasteable) links, is to have pagination controls which invoke JavaScript to show & hide sections, like this:
<div id='section1' class='section'> ... BUNCH OF RADIOS ... </div>
<div id='section2' class='section'> ... BUNCH OF RADIOS ... </div>
<div id='links' style='display:none;'>
<a href='javascript:void(0);' class='show' data-section='1'>1</a> |
<a href='javascript:void(0);' class='show' data-section='2'>2</a>
</div>
JavaScript
Then, create some JavaScript functions (I'm assuming you have jQuery installed, if you don't, you can do this with pure Javascript but it's not as pretty):
function hideAllSections() {
$('.section').hide(0);
}
function showSection(section) {
$('#section' + section).show(0);
}
$('.show').click(function(){
showSection($(this).data('section'));
});
Finally, to hide all the sections except the first as soon as the document loads:
$(function(){
hideAllSections();
showSection(1);
$('#links').show(0);
});
Why do it this way?
There are a few reasons I like this method:
It's progressive enhancement. If the user doesn't have JavaScript, the form will simply all display on 1 page.
You only have to do one submit function, as all the inputs are technically on one HTML page, they just appear on separate pages because of the jQuery pagination.
The only con I can think of is that a user would have to complete it in one sitting.
This could help you start
HTML
<input name="answers[0]" class="button-choice" type="radio" value="1"/>
<input name="answers[1]" class="button-choice" type="radio" value="1"/>
.
.
.
Server side
$answers = unserialize($_SESSION['answers']); // to retrieve user selection
$answers = array_merge($answers, $_POST['answers']); // merges posted values with the ones already kept in session
$_SESSION['answers'] = serialize($answers); // to keep user selections
Can anyone help me .I need php code for checking whether a div is clicked or not.
like,
if (isset($_POST['Submit1'])) { }
But instead of submit button i need a div ...
anyone help me please
thanks
You will need JavaScript for this as PHP doesn't access the DOM if I'm reading your question correctly. I would recommend you add jQuery lib to your page as it's simpler to add click event to a DIV, otherwise you have to add an event listener in javascript yourself for click events on the DIV.
jQuery: http://api.jquery.com/click/
DIY: http://www.codingforums.com/archive/index.php/t-122993.html
I can't tell if you want a div to be treated as a form element, like a checkbox, or if you want to use a div to submit a form.
Using it as a form element has been explained by Stano, if you want the div to submit a form, you really should just use a submit button. If you want to use an image instead of a button, using <input type="image"...> will function as a submit button.
If you really need to use a div to submit the form, you will need javascript. Something like this, we take a form named "bald" and when you click the div, the form "bald" is submitted as if you pressed a submit button.
<form name="bald" action="somefile.php">
<div onclick="bald.submit();">Click here to submit</div>
</form>
PHP can't tell you if a div has been clicked as php only works on the Server. For this you need javascript.
jquery makes something like this very simple.
Can't quite imagine what can be this test good for, but you can use javascript like this:
<div id="clickable_div" onclick="document.getElementById('divclicked').value='YES'"> SOMETHING </div>
in your form
<input type="hidden" id="divclicked" name="divclicked" value="NO"/>
and in php
if ($_POST['divclicked']=='YES') {...} else {...}
I'm trying to build a multi step/page form in PHP and CodeIgniter and I was wondering if any of you could help me.
How can I have a multi step form in CI that updates rather than inserts again when you return to the previous step with the back button? How can I have a form that doesn't have those back button POST form resend messages?
Edit: without JS if possible
Thanks!
Here's my answer from another question. It gives you forward/backward ability without the chance to lose data, instantly jumps between pages, is EASY to code, needs no sessions, and is framework-independent (can be used in any situation):
I develop a product for the Psychology market that does 250 question psychological based testing. To make a test that isn't completely overwhelming, I break the form up into 25 question segments while outputting it in a loop via div tags with a sequential ID appended (ie. div1, div2, div3) Each div is set to display:none but the first.
I then provide the user with a button that toggles the current div + 1 (ie if on div 1, it would do a $(#div2).show() etc. Back buttons do the opposite.
The important part is that the form covers ALL divs. Then its just a matter of swapping out the forward/back button at the end with a submit button.
Voila! Yes, low-tech. But FAST....and no chance to EVER lose values going forward or backward.
So, a rough truncated example:
<form>
<div id="div1">
First 25 Questions
<input type="button">shows next div</input>
</div>
<div id="div2" style="display:none">
Second 25 Questions
<input type="submit">Submit Form</input>
</div>
</form>
Create a unique ID which you use in all steps of your wizard. Save that ID to the database upon the initial saving of your form.
Forward this ID to the next steps using a input type="hidden".
When saving a step, first try to match the ID and, if you find it int the database, perform an update instead of an insert.
To avoid the "do you want to resend post data", perform each wizard step in two CodeIgniter controller actions:
SaveStep5(POST: form instance ID + other "wizards step 5" inputs):
looks up the form instance ID in the database and performs insert/update commands;
redirects to LoadStep6 and passes the form instance ID in a GET parameter;
LoadStep6(GET: form instance ID);
looks up the form instance in the database,
if the instance is not found: error handling
if the instance is found, renders the input form for "step 6"
If you want to avoid those messages which warn the user about resending posts, and you also want to have multiple proper pages rather than just different steps in javascript, you can put the answers in the URL as GET parameters..
so after the first form submission, you will get form2.php? in the URL.. you can add those answers as hidden variables in form2 and so on.
It is not a very elegant solution though. I'd recommend you to use javascript: add a custom handler for form submission and submit form content via ajax, and then load the next form on ajax complete.
Also, like the other person answered, on the server end, you will need a unique ID which fetches/updates the submission data in the database.
I like the approach of waiting on the database update until all steps have been completed. You could store all the data in the intermediate steps in a session. I suppose you could even save the model object you're using (if you're using one) in a session and after all steps have been completed you can do the database insert.
I have a model to store my wizard data with a variable for each field on the form:
class Class_signup_data extends CI_Model {
const table_name="signups_in_progress";
public $market_segment; // there is a field named 'market_segment' in the wizard view
...
...
I have one controller to handle the whole process, with parameters for the session_id and the stage of the process we are at:
class Signup extends CI_Controller {
public function in_progress($session_id=NULL,$stage=1) {
$this->index($session_id,$stage);
}
public function index($session_id=NULL,$stage=1) {
if ($session_id===NULL) $session_id=$this->session->userdata('session_id');
...
...
In this controller I have a switch for which stage we are at - it looks for a 'Prev' button first:
switch ($stage) {
case 2:
if ($this->input->post('prev')) { // if they click Previuous, the validations DON'T need to be met:
$signup_data->save_to_db(array_merge(array('ip'=>$_SERVER['REMOTE_ADDR'],'session_id'=>$session_id,'signup_stage' => '1',
'signup_complete' =>'0'),$this->input->post()),$this->db,$session_id);
$this->load->helper('url');
redirect("/signup/in_progress/".$session_id."/1");
And later in the switch I use CI's Validations to display a form and process 'Next' if it was clicked or it is just being called with /signup/in_progress/session/2:
$this->form_validation->set_rules("your rules");
if ($this->form_validation->run() == FALSE) {
$this->load->view('signupStage2',array('signup_data'=>$signup_data));
} else {
$signup_data->save(array_merge(array('ip'=>$_SERVER['REMOTE_ADDR'],'session_id'=>$session_id,'signup_stage' => '3',
'signup_complete' =>'0'),$this->input->post()),$this->db,$session_id);
$this->load->helper('url');
redirect("/signup/in_progress/".$session_id."/3");
};
At the bottom of each view (eg 'signupStage2.php') I have the prev and next buttons:
<span class="align-left"><p><input type="submit" name="prev" class="big-button"
value="<- Prev" /><input type="submit" name="next" class="big-button"
value="Next ->" /></p></span>
i have a list of names with "delete" button, every row is a form and clicking on delete the list should be updated in real time but don't works because in this plugin i can set only one id (infact it runs when in the list there's only one name)
this is the javascript function:
$(document).ready(function() {
var options = {
target: '#risposta',
resetForm: true,
success: function(showResponse) {
$("#lista_categorie").load("categorie.php").show('fast');
$('#risposta').fadeIn(2000),setTimeout(function({$('#risposta').fadeOut(1000);},5000);}};
$('#elimina_categoria').ajaxForm(options);
});
the html form is build with php:
<form action="categorie_elimina.php?id=$row['id']" method="post" id="elimina_categoria">
<p>$row['nome']
<input type="submit" id="submit_pro" value="elimina" class="elimina"></p>
</form>
i should create a different id for every form (using the id of the row for example) but i should tell to js function that every form must follow that function in this line:
$('#elimina_categoria').ajaxForm(options);
i also used this code:
$('[id|=elimina_categoria]').ajaxForm(options);
but this only works at first click, clicking the second time it opens the php script..
hope you can help me, sorry for bad english
First of all:
Instead of creating several forms with the same id, you should create several forms with the same class. The same value for the ID-attribute should only be used once. Example
<form id="elimina_categoria_1" class="elimina_categoria"> ... </form>
<form id="elimina_categoria_2" class="elimina_categoria"> ... </form>
Please use a more descriptive naming than _1, _2 ... though, if possible.
When each form has the same class, you can call ajaxForm(options) using
$('form.elimina_categoria').ajaxForm(options)
Second:
The script you're probably looking for is something like this
function eliminaCategoria() {
var eliminaForm = $(this).parent().parent(); // Select the form of the button
$.post(eliminaForm.val('action')); // Call the action defined by the form
eliminaForm.remove(); // Remove the form-element from the page.
return false; // don't let the submit-button submit the form.
}
$(document).ready( function() {
$('.elimina').bind('click', eliminaCategoria);
});
The script might not work as-is in your current situation, but I hope this helps you forward. You probably want add the fadeIn, fadeOut effects you used and you might want to check the results of the HTTP POST request before deleting the form from the page.