How do i add a form submission counter? - javascript

so I'm working on a taking a pledge page and I was wondering how can i implement a counter on the page when a user has submitted the form. For instance,
I want to have it display as this.
[ Thank you for taking your time to take the pledge. So far, 5 people have pledged.]
then if another user submitted the form, then it'll add 1 to the counter.
Thank you all <3

I think adding some PHP code as follows, on the same page as your javascript/html should work. Just note that this should be above all html.
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$counter = isset($_POST['counter']) ? $_POST['counter'] : 0;
if(isset($_POST["button"])){
$counter++;
echo $counter;
}
}
This is essentially a button click counter, so anytime a button is pressed the count will increment. When a form is submitted I'm assuming a button is pressed.

Related

jQuery responds with html table containing a (form in each row plus jquery code to edit each row) newly created forms ignore submit()

Three days and I cannot find an answer to this or a solution. I am far from being a jQuery guy.
User arrives at a php page that shows a form to choose the language code and submit. Form gets submitted and the jQuery response builds a table in a div container in the original page. So far so good. The resulting table contains hundreds of rows where the language variables can be edited. On clicking the edit button, I get nothing, no errors in console, nothing. If I use on click, I can fire an alert. On submit, bind, and many others do not work.
I am attempting to load the table, perform basic editing, submit the edits to the db, and refresh the div.table.row with the edited results. I have not gotten to the part where I refresh the rows with the edited data, still stuck trying to submit the dynamic form in each row.
One interesting thing that happens when I use on click, it works with just the first button I click on, it somehow disables all the other rows. I need to be able to submit a row for changes, have that row refresh and move on to the next row all without redirecting. Is this too much to ask? Or should I just move them from page to page?
The ajax php page returns the table using the following code:
if(!empty($_POST['edit_language']) && $_POST['edit_language'] == 1){
edit_language($_POST['lang']); //call function to edit language
} else {
echo "You got here but no variables<br>"; //testing
print_r($_POST); //testing
}
function edit_language($lang){
//query table to get language vars list
$sql = "SELECT lang_site.lid, lang_codes.iso_code, lang_codes.`language`, lang_varnames.varid, lang_varnames.varname, lang_site.varval FROM lang_codes LEFT JOIN lang_site ON lang_site.langid = lang_codes.langid LEFT JOIN lang_varnames ON lang_site.varid = lang_varnames.varid where lang_codes.iso_code = '" . $lang . "'";
$result = db_query($sql);
//generate report table
echo "<table cellspacing='0' border='1'><tr><th>Count</th><th>Language</th><th>Variable Id</th><th>Variable Name</th><th>Variable Value</th><th>Edit</th></tr>";
$a=1; //count the rows to number the rows for easy viewing
while($data = db_fetch_assoc($result)){
//create form in each tr
echo "<form name='edit_" . $data['lid'] . "' id='edit_" . $data['lid'] . "' action=''><tr><td>" . $a++ . "</td><td>" . $data['language'] . "</td><td>" . $data['varid'] . "</td><td>" . $data['varname'] . "</td><td><textarea class='form-control' name='varval' id='varval' cols='100' wrap='virtual'>" . $data['varval'] . "</textarea></td><td id='editresponse'><button type='submit' class='button' type='submit' id='but_" . $data['lid'] . "'>Edit</button></td></tr></form>";
?>
//jquery to post edits
<script language="javascript">
$(document).ready(function()
{ //using $.ajax() function
//alert("document ready"); //this alerts each row
//this function will not work, no errors, simply nothing
$(document).on("submit", "#edit_<?php echo $data["lid"]; ?>", function(e)
{
//alert("button clicked"); //this does not work
var data = $("#edit_<?php echo $data["lid"]; ?>").serialize();
$.ajax({
type : "POST",
url : "/lang/ajax_langs.php",
data : data,
success : function(response)
{
{
$("#editresponse").html(response);
};
}
});
e.preventDefault();
});
});
</script>
<?php
}
echo "</table>";
}
?>
How do I get the jQuery to submit the individual form in each row to effect an edit and then refresh each row individually as languages are edited? I need to add another form to each row to delete an entry then remove the row dynamically, but I am stuck here without being able to submit any of these forms.
I should add that this generated form shows well in the website, but is not shown in view source. Using chrome browser. I'm open to any suggestions. Thanks in advance for reading. I seriously hope I can find a solution here. Otherwise, I'm back to the 90's on this software.
It's not working because you are only submitting one id. You need to make each of your forms be of the same class. Therefore, any form clicked will be processed. Like
<form class="myForm" .....
Then, the Jquery would look like this
$(".myForm").submit(function(e){
var inputToChange = this.varval; // saw input varVal, but use whatev
var dataToChange = inputToChange.value;
// then send the data to php for processing using ajax or post
Then, use inputToChange.value = whatever new value you want to put into the form input or other div/td etc. you want to change. If you want to change data that isn't in an input, just make that td a text input and disable it from being edited by the client
<input type="text" name="lname" disabled>
then on callback send new data to this.lname.value = (many other ways to do this as well)
Don't forget, if you send through ajax you want to stop the form itself from submitting so use e.preventDefault()

Setting the color of an HTML element using an index and Jquery

I am designing a web application for handling various requests to a management team. I have these requests display in tables grouped by the type of request. Initially every request is given a red button since by default requests have not been completed. I am trying to figure out how I can change the color of a specific request's button once it has been marked as completed. Below is my Jquery code:
<script>
<?php
if(isset($_SESSION['index']) and $_SESSION['complete'] == 'internal'){
echo "var index = '{$_SESSION['index']}';";
unset($_SESSION['index']);
unset($_SESSION['complete']);
echo "$( '.complete:eq(index)' ).css('background','green')";
}
elseif(isset($_SESSION['index']) and $_SESSION['complete'] == 'client'){
echo "var index = '{$_SESSION['index']}';";
unset($_SESSION['index']);
unset($_SESSION['complete']);
echo "$( '.client_comp:eq(index)' ).css('background','green')";
}
?>
</script>
By pressing a button you are sent to a page that displays all of the relevant request information. This is done by using another bit of jquery code to store the index of that class of button in a PHP session variable and then using that index to determine which request to load from the database. This page has a complete button that returns to the page with the tables and passes the index and the type of request that was completed back to that page. What my above code is attempting to do is set the color of that specific button using it's type and index. At this point in time everything works as expected except for the color change. I have searched and not been able to find a problem like this. Any help would be greatly appreciated.
I don't understand why you need js variable.
Can you try this.
<script>
<?php
if(isset($_SESSION['index']) && $_SESSION['complete'] == 'internal'){
echo "$( '.complete:eq(".$_SESSION['index'].")' ).css('background','green')";
}
elseif(isset($_SESSION['index']) && $_SESSION['complete'] == 'client'){
echo "$( '.client_comp:eq(".$_SESSION['index'].")' ).css('background','green')";
}
unset($_SESSION['index'],$_SESSION['complete']);
?>
</script>

how to get confirmation box value in php

condition :
when i submit a button, the system will check database A and run query data using mysql. if any data exist, a popup box will ask if i want to proceed with the action, if i answer ok, the system will check database B and run query and ask the same question. if i answer ok, the system will update the database. can i use javascript in php for this situation?
my current script
if($_POST['submit']){
$check = $db->check_table($idnumber);
if($check>1){ echo "<script type='text/javascript'>confirm('Proceed?')</script>"; }
}
how do i get the value of the confirmation box when i click ok or cancel so that i can proceed to check the second table.
I would just enclose your HTML in an if statement in PHP
<?
if($_POST['submit']){
$check = $db->check_table($idnumber);
if($check>1){?>
<script type='text/javascript'>$(function() {confirm('Proceed?')});</script>
<?
}
}
?>

make button disapear when clicked even when visited next time

I have a problem i am making a website with a button on it.
The problem is that i only want this pressed once by the user who visits the site.
So when ever the user refreshes or comes back it isn't possible to press it again.
I think i should use a combination of PHP with AJAX but unfortunally i am not good enough to get it together. In the hope somebody here can push me in the right direction :)
the html code:
<form action="" method="POST">
<input id="banana_button" type="submit" name="button_press" value="Add banana's!">
</form>
the javascript:
$('input[name="button_press"').click(function(){
$('#banana_counter_text').append($banana+1);
$(this).attr('disabled',true).css('width','180px').attr('value','thanks for adding a banana');
});
What i want to get is that when they pressed the button next time they visit they won't see the button.
Is it possible and how could i best do this. I hope you guys can help me
Update:
Well i was trying the last few days to resolve this problem and i got it working.
I am using a session_cookie with a custom name. Everytime the site is loaded it checks if that cookie is available if not than it wil show the button. Else it will delete the whole button.
the code looks like this:
PHP
//this is what checks everytime if the cookie is set
if (isset($_COOKIE['banana_added'])) {
//code for disabling the button
}
//this is what makes the cookie and checks if the submit button is pressed.
//because people where wondering how the data is stored. It is just a simple XML file
if(isset($_POST['buttonsubmit'])){
/*when submit is pressed */
session_name("banana_added");
session_start();
$xml = simplexml_load_file('../banana.xml');
$prev_count = $xml->banana_count;
$new_count = $prev_count +$_POST['buttonsubmit'];
echo $prev_count;
echo $new_count;
$xml->banana_count = $new_count;
file_put_contents('../banana.xml', $xml->asXML());
header("location:../landing.php");
Thank you all for your help. I don't know how i can close this thread ?
This is the solution for this particular problem
In order to remember that change you should either put that value in COOKIE/SESSION or in DATABASE. The second variant ofcourse is preferd.
So lets say in example you have table called buttons and in it you have a column 'checked' with type tinyint (accepting values 0 and 1) and default value of 0.
In your html you should do this:
<button <?php ($thisButtonQuery->checked == 'checked')? 'disabled' : '';?>>button text </button>
Regards and i hope i resolved your roblem! :)
Well i was trying the last few days to resolve this problem and i got it working. I am using a session_cookie with a custom name. Everytime the site is loaded it checks if that cookie is available if not than it wil show the button. Else it will delete the whole button.
the code looks like this:
PHP
//this is what checks everytime if the cookie is set
if (isset($_COOKIE['banana_added'])) {
//code for disabling the button
}
//this is what makes the cookie and checks if the submit button is pressed.
//because people where wondering how the data is stored. It is just a simple XML file
if(isset($_POST['buttonsubmit'])){
/*when submit is pressed */
session_name("banana_added");
session_start();
$xml = simplexml_load_file('../banana.xml');
$prev_count = $xml->banana_count;
$new_count = $prev_count +$_POST['buttonsubmit'];
echo $prev_count;
echo $new_count;
$xml->banana_count = $new_count;
file_put_contents('../banana.xml', $xml->asXML());
header("location:../landing.php");
Thank you all for your help.
This is the solution for this particular problem

How to check if input type button is pressed in PHP?

The isset() function can be used to check if the input type submit is pressed, but is there a way to check if the input type button is pressed?
In my code the button does nothing but call a function on the .Onclick() event which then refreshes the page and makes a database entry inside PHP...and I want it to make the entry only after the button is pressed...and I can't use the submit type for other reasons...following is some code:
function send()
{
var events = document.getElementById("event").value;
location.href = "calm.php?day=" + xx + "&month=" + yy + "&year=" +
zz + "&events=" + events;
}
<input name="Button"
type="button"
id="submit"
onclick="send(this.form)"
value="Button" />
<?php
session_start();
include_once "connect_to_mysql.php";
$day = $_GET['day'];
$month = $_GET['month'];
$year = $_GET['year'];
$events = $_GET['events'];
$userid = $_SESSION['id'];
if (isset($_POST['button']))
{
$sql = mysql_query("INSERT INTO events (userid,month,day,year,events)
VALUES('$userid','$month','$day', '$year','$events')")
or die (mysql_error());
}
?>
isset($_POST['Button']) you just missed the capital B. You need to match it the same as the input's name attribute.
you need to do that using ajax. so when a user clicks this button the page won't refresh.. there should be a page behind the seen does that for the user. whenever he clicks the button it accesses that page and upload whatever data you want...
edit:
or you can just add a hidden input in the form when the button is clicked the hidden input value changes to i.e. true... then from php codes you can use the isset or other functions to validate whether the user clicked the button or not...
In the example you have, the simplest approach would be to add an extra variable to the parameters passed in &button_press=true or something like that and then you would know that the button had been pressed when you are receiving the information
'locrizak' answered right . Your button name is 'Button' and you tried to check presence of click on 'button' both are different .
In such case if you are unsure of what is wrong , you may print the entire POST array using
print_r($_POST)
This will display all submitted values from form including button
Using isset() is the correct method to check whether a form element is present or not
Use
if(isset($_POST['Button'])){
//code block for insertion,validation etc //
}
isset() function does not works with input type=button. so either we have to use input type=submit instead of button or some hidden type if we still want to use button.

Categories

Resources