SO FAR I have made a website which is connected to a MYSQL database. On the website I have many buttons, each button corresponds to a table in my database. When I click the button, a javascript function opens my php file in this form
xmlhttp.open("GET", "addPoint.php?q=" + name, true); Where name is the name of the table
Back to the html. I have a div with an ID that will update with whatever the PHP echos.
The div is now populated with table, reflecting the table in mysql. This all works fine.
Here is the problem: I am trying to implement a voting system, where you vote by clicking on one of the elements of the newly created table. AFAIK the MYSQL updating which will need to happen for the vote to work, will need to be done in PHP, which means that I need to tell the PHP file
The name of the table
The name of the element
I am reluctant to use forms because I would like to just be able to click some text, NOT have to fill in a form or click a radio button.
So how do I get these 2 bits of info to a PHP file? Is the structure which I am doing this any good or should I step back and redesign?
Thanks for reading please let me know if I have been ambiguous.
Familiarize yourself with JQuery. It's great for projects like these.
http://www.w3schools.com/jquery/default.asp
As Norse already alluded to, use javascript to submit a "form" request for you. The javascript can populate the table and element values for you based on the button which was clicked. It is up to you whether this is a GET/POST.
JQuery would be a great way to help make this easier, but you don't need it if you don't want it.
Related
I have a student management system project, where i am taking student enrollment form online using custom php apps.
When i am inserting enrollment form at the very first beginning of the form there is a drop down list of student iD. my client wants if he / she selects the ID of a particular student from the drop down list, his data will appear in to the text box automatically based on selection.
I know that here i require javascript but i am not sure how to do that.i have searched but didn't found any thing relevant exactly. Can any help me out.
Thanks
You need to first capture the onchange event of the drop down list. When this event fires, you will need to run javascript that makes an AJAX call to the server in order to retrieve the student's data based on the selected student in the drop down list. You will need PHP/MySQL server side code to handle this request. When the AJAX call returns with the data, you will need more javascript to populate the textbox where you want the data displayed.
I won't write the code for you, but hopefully this is enough to point you in the right direction.
Edit: If you need more details, lookup how to create an AJAX call in jQuery. Your requirements are not uncommon, so you should be able to find examples that are very near to what you need. See a relevent tutorial: jQuery AJAX Tutorial
I am not sure how to word the question because I don't really know what exactly I'm even asking for. Basically I have built a small sales portal that puts info in a database and then spits it back out in various ways. Occasionally the records need to be updated, but I need a way to update them from the web page where the records are displayed (without going to a completely different page) so that the sales people do not have to go into the database to change the records. I know how to use the UPDATE function with PHP, what I would like to do is have an "Edit" button at the end of each row and have the information become changeable when the button is clicked. What programming language would I need to do this in? How would that code be structured? I am really only familiar with PHP, HTML, and CSS.
Thanks for your help!
You're going to need javascript to handle the form fields the way you mentioned.
Each record row wil have the original value and a hidden input
Javascript will hide the original value and show the input
You could either have a save button at the end of each record row or a master "save all" button". Having multiple at the end of each record will be easier but from a users point of view maybe a bit cumbersome.
Use AJAX to send the updated data to the server - this should be handled in the "save record" javascript function.
Then you'll need PHP or some other server side language to actually update the record.
I wonder is someone can help, I'm building a website, which is driven from a database. It will consist of user submitted information.
Currently all the information is pulled from a record in the database and is being output via a PHP echo, what i would like too do is add a feature that would allow me to edit the information if incorrect from the websites front end.
I have seen many websites have some form of edit icon next to information in there databases, when clicking this icon the echoed text changes from text to a text field and you are able to update the field being echoed from the database.
Im a designer so have limited knowledge of how functionality for this kinda feature might work.
please could anyone let me know how something like this might be achieved.
many thanks.
You would need to build some kind of javascript functionality to allow the in-place editing of those data bits. One possible solution is a jQuery plugin like jEditable.
Then you need to build a server-side script in something like PHP or ruby where it would take the submitted information and update the database.
well the process is the same for the front-end and back-end. it depends whether you want you build a password protected editable forms or just editable for everyone.
One way you can do this is
echo your information into text inputs
give them a css class that removes the border and makes it transparent
make it readonly(so someone couldnt tab into it and change it)
add a javascript onclick event that changes the class to a normal
text box that is not readonly
add a javascript onchange event that uses ajax to save the new
information into the database when they are done typing, or press enter
after the ajax is done turn the text box back to the first css class
EDIT also add a onblur event that changes it back as well
you could even change the cursor for the text input to a pointer instead of the default (text) cursor so that is looks like you can click on it.
.
now html5 has contenteditable attribute which you can set for elements
simple example:
www.hongkiat.com/blog/html5-editable-content/
simpler demo:
https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_global_contenteditable
In a PHP application I'm building, I'd like to have an 'editable' table. The idea is that each row will have an edit button, which, when clicked, will replace certain fields with text fields and select lists and change to a save button. When the user clicks save, the data data should be validated and changed if appropriate.
I'm mainly tackling this as a learning project (I'm aware there's a ton of stuff already out there) and to see if I can get anything 'cool' working. I've created a PHP table-generating class that can take an array of objects as a datasource, and can have columns created based on those class methods.
e.g.
$table = new Table($dataSource);
$table->addColumn('Name', 'getName');
$table->addColumn('Amount Due', array('getOrdersManager', 'getTotalAmountDue')); //First calls getOrdersManager() on each data item and then calls the getTotalAmountDue() on the result
I'd like to try my hand at extending this to be able to the table row and have those changes reflect on the corresponding object in the data source.
I don't really have very much experience with AJAX although it's clearly going to play a very important role in getting this to work correctly.
Any tips on how I should approach such a task?
Edit: I'm not really interesting in looking at Ajax libraries at this point (I do have some experience with jQuery). I'm more interested in learning the basics of Ajax at this point.
my tip is to use jquery(does most of the heavy lifting for you and is easy to learn).
The idea is that each row will have an
edit button, which, when clicked, will
replace certain fields with text
fields and select lists and change to
a save button
http://api.jquery.com/click/
When the user clicks save, the data
data should be validated and changed
if appropriate.
http://api.jquery.com/jQuery.post/
Some things to be aware of/think about:
Are you going to send every field change to the server, or only the whole row (the latter is more resource efficient, but not necessarily as accurate)
How are you going to ensure the data displayed stays accurate even if the update to the server fails for some reason (either a network failure or a DB/validation error)
How will you ensure the user has permission to update the record and that you don't open a security hole by allowing the AJAX responder just to update whatever record it is told to. My approach has been that if a record is shown in the interactive table then the user has the permission to update it, so a cache of record IDs is held in the session when the table is created
Are you going to load options dynamically? If you don't, then a long table can end up containing a lot of HTML because of repetition of the select controls, but again it is more resource efficient not to have a request every time a user clicks into a dropdown. One compromise might be to put the options into a hidden HTML field and load them dynamically into the correct place when a user clicks a dropdown
I have a php "add classified" page where users may fill in details in several drop-lists.
At the bottom, I have a picture upload tool, which requires the page to submit to itself, and then preview that image.
Problem is, whenever this is done the drop lists values are resetted, so the users have to re-select everything.
I have asked this Q before, but the method I went with doesn't work I have noticed now...
here is the Q:
'Remember' form drop list value when submitting to SELF?
I have managed to solve this, as mentioned above, by using javascript with PHP to "grab" the value of the chosen option, and then use the value which has an ID with the same name exactly, and add a selected tag to it. See below: (this js is at the bottom of the page)
var areaOption = byId("<?php echo #$_POST['annonsera_area'];?>") || "Välj Län";
areaOption.selected=true;
The problem here is that whenever an element has the same id as another one, it wont work. And I have to use same ID:s, because alot of the options are "years" which the users may select as "make year" of their "vehicles"...
Anyways, is there any other way to solve this?
Thanks
Have you considered using an AJAX-style file upload script? For example:
http://www.uploadify.com/
This would allow your users to upload an image to the page without having to submit the entire form or refresh the page.
Technically you shouldn't have identical IDs. Try to rethink how you are doing it, but otherwise, you could use AJAX (assuming that you are happy to only support people with javascript enabled).