I tried this with different ways, but couldn't do it. Please help.
I would like to save the ordering of inputs into database. When form submitted, next time it shows with the new ordering.
I have mysql db_table with 4 columns = user_id, order_id, input_name, input_value
When user submits the form with all inputs, it saves 5 rows, but when user fill in 3 inputs and empty 2 of them, it only saves 3 rows in the database. And when user submits with all empty inputs, it saves nothing and remove all from database if already was there. (I know this part).
What i want to know is how to save the ordering of inputs into order_id. When user hits the up and down buttons, it reorders the inputs and i want to load the form next time with new ordering. Thank you.
<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(function() {
$('.up').on('click', function(e) {
var wrapper = $(this).closest('li')
wrapper.insertBefore(wrapper.prev())
})
$('.down').on('click', function(e) {
var wrapper = $(this).closest('li')
wrapper.insertAfter(wrapper.next())
})
})
</script>
<ul>
<li><input type="text" id="one" name="one" value="example one value"> <a class='up' href='#'>up</a> <a class='down' href='#'>down</a></li>
<li><input type="text" id="two" name="two"value="example two value"> <a class='up' href='#'>up</a> <a class='down' href='#'>down</a></li>
<li><input type="text" id="three" name="three" value="example three value"> <a class='up' href='#'>up</a> <a class='down' href='#'>down</a></li>
<li><input type="text" id="four" name="four" value="example four value"><a class='up' href='#'>up</a> <a class='down' href='#'>down</a></li>
<li><input type="text" id="five" name="five" value="example five value"> <a class='up' href='#'>up</a> <a class='down' href='#'>down</a></li>
</ul>
<br><br>
<input type="submit" value="Submit">
</form>
Maybe you could just store the positions of those fields?
+----+---------+---------+-----------+----------+----------+
| id | pos_one | pos_two | pos_three | pos_four | pos_five |
+----+---------+---------+-----------+----------+----------+
| 1 | 2 | 4 | 3 | 2 | 1 |
| 2 | 3 | 2 | 5 | 1 | 4 |
| 3 | 1 | 2 | 3 | 5 | 4 |
+----+---------+---------+-----------+----------+----------+
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.