Ok, so the weirdest thing happened here.
I have a php file with Javascript to write onto elements based on events on the webpage.
And there are 3 html forms on the page. One is a searchbox, one has all inputs hidden and gets submitted on a certain event, and one is a textbox and a button on clicking which the javascript writes the text to a certain element in the page.
Also, this third form is itself written onto the document by the javascript on clicking another button.
The problem is, while doing certain operations with this third form, i need to reference one of its inputs values (newSkillName).
So for this third form, In Chrome-
document.forms[1].newSkillName.value
works,
while in Firefox-
document.forms[2].newSkillName.value
works.
I, however, managed to fix the code. But i'm still curious. Why did Chrome and Firefox process the abnormality differently?? Any idea?
Give the form elements unique ID attributes and reference them with document.getElementById(id).
You could also use the NAME attribute and reference the form by name document.forms["name_of_form"];
The quick workaround/copout fix is to hunt down the field in the DOM a diffferent way. For example, with id='NewSkillName' use document.getElementById('NewSkillName').value.
Related
I have two input elements:
one for typing
another for display the submitted text as a tag
These two input elements are on the same form.
I would like for a user to enter text into the first input element and then when they press "enter" on the keyboard the text is displayed in the second input field as a tag.
In the second input element I tried to execute this code but it is not working:
" />
Note: I am using Bootstrap 3 library.
Any help would be much appreciated.
use JS or jQuery for it.(something like this $('#yourelement').on('keyup',function(event){.....})); issues like this should be solved on client side, not on serverside using PHP.
to solve this issue with html+PHP only, you have to reload the page all the time after Enter press (you have to make a form and on Enter form will be submitted, then get this data in PHP and put in form again, BUT this is really bad way programming)
It won't work with PHP. PHP does not run in the browser only on the server side when the page is loaded. You need to use a client side language.
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.
I am new to html, I would be really glad if you can help me with this.
I have a web page where there is a list and some other text inputs and buttons. This option list can be populated by clicking the "add" button in the page, this add button is to direct to another page and in that page there are some chekboxes, those which are checked are loaded back to the main page,(where I have the list) .
At the end data in the main page needs to be loaded to the database, (what is in the list and in the text inputs).
Since I'm new I just know little about php and html, I thought I should have a form within a another form(form to "add items", form to load to the database) and it is not possible in html. Can anyone suggest the best way to do this? Do I need to use javascript?
Why can't the extra inputs (the ones that would be in the second form) be part of the first form? I think the question will become clearer if you post a sample form so we can see the relationship between the two forms.
But overall, since you're ultimately only submitting one form, then maybe all the inputs belong together. If what you're calling the second form isn't supposed to be visible right away, you can still have it be part of the same form, but only reveal it when needed.
Again, some sample data would help to understand the exact context of your question.
in php if you use input name="somename[]"
for a number of input elems
you will get an array in $_POST['somename'] and access all the values.
I think what you're after - if I understand you correctly - is ajax. Ajax allows you to asynchronously send data to/from another script without leaving the current page. This is accomplished using JavaScript. In your case I think what you need to do is set an onclick event in JavaScript to a button:
<input type="button" onclick="javascriptFunction()">
You can read more about ajax here:
http://www.tizag.com/ajaxTutorial/ajaxform.php
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
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).