I have a php page with a form on it for adding people to a small group.
For each person being added, there is a with multiple form elements, each named according to the person's number. For example:
<div class="user">
<input type="text" name="user1LastName" />
...
</div>
<div class="user">
<input type="text" name="user2LastName" />
...
</div>
For each person in the database, the php page populates a form sections.
To add additional people, the user can click on a "+" icon, at which time the page uses jQuery to dynamically populate a new . To do this I am simply appending the new div html to the existing form. This means that the javascript page contains all the same html markup (to be appended), as the php page.
This seems like an unnecessary duplication of code. Whenever I change something in the php page, I also have to change it in the javascript code.
Is there any general method for avoiding such code duplication? The only thing I can think of is to use jQuery to grab the html from an already existing div. But in this case, the values of the form fields for user n will appear in the new code for user n+1.
Thanks.
Capisci :)?
<div class="user" id="user_1">
<input type="hidden" name="uid[0]" value="1"/>
<input type="text" name="lastname[0]" value="user480029"/>
...
</div>
<div class="user" id="user_2">
<input type="hidden" name="uid[1]" value="2"/>
<input type="text" name="lastname[1]" value="arto"/>
...
</div>
Now when adding another field just...
<div class="user" id="user_3943094103945">
<input type="hidden" name="uid[]" value=""/>
<input type="text" name="lastname[]" value=""/>
...
</div>
Then you iterate trough $_POST[] a do what you want.
You have user ID on .user, so I you delete user you can remove that part of HTML (this is more for UX), more importantly, you don't have hundreds of variables but just a few array which you can iterate in one loop. Hope you get the point. Cheers.
The php code should give the javascript a "prototype", which could be modified using javascript. That way, even if there aren't any users, the javascript would still work. This example is obviously missing lots of code (like forms), but it should give you an idea. I haven't tested it because I assume you have to make lots of modification anyways.
<script type="application/x-javascript">
addEventListener("load",function(){
document.getElementById("add-user").addEventListener("click",function(){
var node=document.getElementById("prototype-container").getElementsByClassName("users")[0].cloneNode(true),n=document.getElementById("add-user").getElementsByClassName("users").length,list=node.getElementsByTagName("input");
document.getElementById("user-list").appendChild(node);
node.id="users_"+(n+1);
for(var i=0;i<list.length;++i)
list[i].name&&(list[i].name+="["+n+"]");
},false);
},false);
</script>
</head>
<body>
<div id="prototype-container">
<? /* print out a div without any information in it */ ?>
</div>
<div id="user-list">
<? /* print out divs with some infomation in them */ ?>
</div>
<button id="add-user">add a user</button>
Related
Below is my form- which value i like to update into database.
<form action="#" class="form">
<div class="form__slider">
<div class="form__slider-rating" id="slider__rating"></div>
<div class="form__slider-value" id="form__slider-value"></div>
<!-- <input type="number" class="form__slider-value" id="form__slider-value" value=""> -->
</div>
<input type="hidden" name="movie_id" id="movie_id" value="<?php echo $post_id; ?>" />
<input type="hidden" name="name" id="name" value="<?php echo $userName; ?>" />
<textarea class="form__textarea" name="remark" id="remark" placeholder="Review"></textarea>
<button type="button" class="form__btn">Send</button>
</form>
and in site it was look like this
This blue mark value I need to update into database. How to do that?
Regarding PHP, you need to handle a form.
Firstly, write a code that would handle the form itself, you can do that, by putting some php on top of your page;
if(isset($_POST['form-slider-value'] && $_POST['form-slider-value'] !== null) {
$value = $_POST['form-slider-value'];
//Database handle
}
Of course don't forget to add name 'form-slider-value' to the input.
Ideally there would be classes or similar stuff for that, I'd advise you to use some kind of framework.
Basically. PHP and FORMS works with handling them, once you submit your form with a button submit, it goes to a place where you address it Form action=. Then everything that is written within names will be at $_POST data.
It is not recommended to keep standalone code in one file, with HTML,css,PHP all together.
Hope that answered your question.
As well. This thing is very common to do or use. I advise you to learn about PHP Forms.
https://www.w3schools.com/php/php_forms.asp
And read about constructing a class. Id say do it the proper way.
Learn about frameworks as well, they are modern day time saviors once you learn it.
I have a page ( index.html ) with a form. On submit the data is posted to a php-file which then stores said data in a (temporary) xml-file, however, I also have a number of iframes which also contain forms.
At first, I was planning on simply posting the input-data from the iframes to a seperate php file but I encountered several problems:
-I have several iframes, but I don't have a fixed amount since the user is supposed to be able to delete/ add iframes. Therefore I can't just tell iframe 1 to send its data to php-file no. 1, iframe 2 to send its data to php-file no.2 etc.., I need a flexible solution.
-I tried to submit all iframe inputs to ONE php file and was hoping it'd work since the xml-file this php-file sends the data to is only updated and not completely overwritten. As you might guess, this did not work.
-Another problem I encountered is that the user may go back and edit whatever he entered into the iframe. The data should only be saved once he clicks on the save button in the html-file to prevent that.
I also tried submitting the data via JavaScript, as people in similar questions suggested, but that did not work out for me. So I guess what I would like, is a suggestion as to how I should go about this. How can I send all the data once the "main" save button is clicked, it doesn't matter if the data goes to several php files. The solution shouldn't depend on a fixed amount of elements as that amount is not always the same.
Here's the iframe-html:
<form method="POST" action="php/iframe.php">
<label>Your thoughts:</label>
<input type="text" name="header">
<label>Suggestions:</label>
<textarea type="text" name="textbox"></textarea>
<input type="button" value="submit">
</form>
(It's basically the same for all Iframes).
Please let me know if you need any additional information.
Edit: I read that submitting forms at the same time may cause interference, I know that much
Edit:
Relevant index.html:
<form method="post" action="main.php">
<div id="firstSection"
<label>First input</label>
<input type="text" name="input[]">
<button type="button" onclick="openIframe1()">Read more</button>
</div>
<div id="secondSection"
<label>Second input</label>
<input type="text" name="input[]">
<button type="button" onclick="openIframe2()">Read more</button>
</div>
<button type="submit" value="submit"></button>
</form>
<div class="iframe">
<button type="button" class="close">Close</button>
<iframe src="iframe1.html"></iframe>
</div>
<div class="iframe">
<button type="button" class="close">Close</button>
<iframe src="iframe2.html"></iframe>
</div>
Define an array of your iframe inputs in the main page as hidden element, on click submit in the main page loop through the iframe by getting the datas and append to your hidden element from where you can now post that to your back end.. try this: Access jQuery data from iframe element
I have a page that has multiple php forms that send me different informations depending on the user and the form. How do I make php differentiat these? I saw something about the actions and I thought maybe it was like having a separate file, but when I created a "questions.php" and copied and pasted my php code into that and then added "action="questions.php"" to the tag, and ran it just as I had before it didn't work. So what is the correct way to do this?
My code is extremely long and filled with words which is why it would be nice to have separate files for it depending on the form instead of all in the top of my main page.
You could build one page as a standard page. in this page you could include the different forms. See the example below:
<!-- These are just example names -->
<div class="form-1">
<?php include "forms/form-1.php"; ?>
</div>
<div class="form-2">
<?php include "forms/form-2.php"; ?>
</div>
<div class="form-1">
<?php include "forms/form-3.php"; ?>
</div>
If you would like to save data that a user puts in a form in lets say a database you should use the <form method="post"> by adding an action to it. You're asking the form to send the user to another page when the submit button is clicked. an example of a form down below.
<form class="form-1" method="post" action="second_page.php">
<label>Name:
<input type="text" class="input" name="name">
</label>
<label>Email:
<input type="email" class="input" name="email">
</label>
<button type="submit">Send!</button>
</form>
Hope this helps!
I just added a / before the questions.php. apparently it had to do with file path? I don't understand it but it works now.
<form action="questions.php" method="post">
<!-- text boxes to get user inputs-->
<button type="submit" value="submit_btn">click here to go to page in action tag
</button>
</form>
If questions.php file is in same folder action="questions.php" is enough. If its inside 'x' folder, correct path should be given as action="x/questions.php"
I have a simple form with two slider and two buttons created using links, because truthfully those links are images created with css.
So, I want to be able to send all slider values when you click the button and then retrieve those values in the second div to show it.
I want to do it using PHP, so I think the best way is to send over POST and then retrieve it using the same way.
</br></br></br>
<div class="main">
<form method="post" action="">
<input type="range" name="val1" id="val1" value="5" min="0" max="10" data-show-value="true"></br>
<input type="range" name="val2" id="val2" value="5" min="0" max="10" data-show-value="true">
</br>
</form>
</div>
<a class="btn1" href="#">Button 1 - View 1 (Sliders)</a></br>
<a class="btn2" href="#">Button 2 - View 2 (Results)</a>
<div class="second">
<p>--Second div---</p>
<p>--Value 1---</p>
<?php $_POST['val1'] ?>
<p>--Value 2---</p>
<?php $_POST['val2'] ?>
</div>
At first I want to know how to pass values between pages and then when you come back to the main view put the value selected before. I think this can be done using $_SESSION.
So, what do you suggest to get the values from the each slider and put it in the second div using PHP?
I want to develop a dynamic site when depends on the button that you click go to one page or another. I have nearly 20 possibilities depends on the button clicked, so I think that the best way is using divs and putting all the PHP and HTML code in a file and show or hide depends on the button that you click.
And I using bootstrap-slider library, but to do the example I used the jquery slider.
I've done a fiddle to see if someone is able to do it.
https://jsfiddle.net/dperezq/ph7mfu0v/
I am trying to pass a variable (maybe the name of the div), to create an dynamic page without using javascript.
I try to avoid javascript as much as possible, as you could imagine from the first sentence.
My script looks kinda like this:
<?php $topbar = $_GET['topbar']; ?>
<form action="" method="get">
<div id="navigationTopContent" name="start" onclick="window.location=''">
1. entry
</div>
<div id="navigationTopContent" name="group" onclick="window.location=''">
2. entry
</div>
</form>
but it is absolutely not working.
you are already using form to post/get values, just use input type hidden if you want to sent data anonymously.
<input type="hidden" name="abc" value="data">
when using form you must use submit button to post data.
or you can use anchor tag to post data as :
echo 'Entry';
If you are trying to pass a post / get variable, apprently you have to use buttons and correct the css so that the button is looking like your div was. You them the same name and different values. It looks kinds like this:
<form action="" method="get">
<div id="navigationTop" class="text">
<button class="navigationTopContent" name="topnav" value="start">Start</button>
<button class="navigationTopContent" name="topnav" value="group">Groups</button>
</div>
</form>
<?php $topnav = $_GET['topnav']; echo $topnav; ?>
this is not perfect, since the buttons is, due to some magic always a bit darker, but ok.