Problem With Javascript Form Interaction - php

I'm having an issue with a javascript interaction on a site, and I can't figure out what's going on.
The basic gist of this site is this: One single .php page that has multiple includes contained within hidden divs. When the next or back buttons are clicked one of the divs becomes active (visible), and it contains questions with image links for answers. When one of these links is clicked a javascript function is called which is supposed to set a value in a hidden form field equal to the value that's passed to the function from the link.
I've got no idea why it's not working. I've done stub testing using alerts, and everything is being passed correctly. Occasionally it'll work on one question, but never all of them. Any help would be greatly appreciated. You can find the source code here:
http://3-1.faile-test.appspot.com/kilt_page.php

It looks to me that you are setting the wrong value in the hidden fields.
For example if I enter a company name "foo inc", the field is set as:
<input type="hidden" value="company_name" id="company_name_answer">
Should it not be?
<input type="hidden" value="foo inc" id="company_name_answer">
I think that the change_selection function is wrong, you have:
function change_selection(selection, answer)
{
var selection = selection;
var answer = answer;
document.getElementById(answer).value = selection;
}
It should presumably be...
function change_selection(selection, answer)
{
document.getElementById(answer).value = document.getElementById(selection).value;
}

In case anyone else has this issue, here's how I solved it:
I added default values to the hidden form inputs. So, instead of:
<input type='hidden' name='answer_name' value='' />
I have:
<input type='hidden' name='answer_name' value='default' />

Related

html checkbox onChange methode in php

Here is my problem, I know only html and php and I have no clue about how to use javascript... And all the solutions about my problems seems to be resolved in javascript and I wondered if there was a way to do it with php so that I could understand what I do.
I want to put a checkbox on the corner of my page (for instance "hide information") that would refresh the page automatically when checked and that would hide information on the page.
What I currently do is :
<?php
if(isset($_GET['condition']))
$_SESSION['condition'] = true;
else
$_SESSION['condition'] = false;
?>
...
...
<form>
<input type="checkbox" name="hide" value="1" onChange="this.form.submit()" <?php if($_SESSION['hide']) echo "checked";?> > hide information
</form>
I am facing two problems :
the first one is that I want the checkbox to stay checked/unchecked when the page is refreshed.. I solve that poorly with my php code, but there surely exists something better to do that.
When the box is checked, the page is refresh with only "hide=1" as an url argument, but I would love to keep all the other arguments that were there before the page was refreshed. Is there a way to refresh the page and keep all the arguments while knowing that the box is checked/unchecked ?
thanks for your help, and sorry for my poor knowledge.
Regarding the second point of your question you can move the POST (or GET) array to the SESSION one and back with the following code:
if(isset($_POST) & count($_POST)) { $_SESSION['post'] = $_POST; }
if(isset($_SESSION['post']) && count($_SESSION['post'])) { $_POST = $_SESSION['post']; }
I use this to do exactly the same. When I reload the page I keep the posted values.
Regarding the first point you are already on the right path.
I don't see anything wrong with how you've tried to solve problem 1.
Regarding the URL problem 2, either put session_start(); at the top of the page to get the session to work correctly.
Alternatively have hidden inputs in this pages' form and echo out the previous pages' POST values.
<form action="" method="post">
<input type="hidden" name="condition" value="<?php echo $_POST['condition']; ?>" />
<!-- have hidden inputs from previous page here, plus your checkbox to retain post values from the previous page -->
</form>
Although I'd recommend POST for this, you can do GET although it gets a bit messy like so:
<form action="thispage.php?condition=<?php echo $_GET['condition'];?>" />

Edit the value of an <input> element by jQuery

I want to fill an element with data using jQuery.
Unfortunately, the element stays blank. Until now, i used a workaround and used a textarea instead of input (which is working for some reason).
I did not only try
$('#input').val("Text") ;
but also
$('#input').text("text") ;
$('#input').attr("value", "Text") ;
I do not understand this behaviour, outside of my project it works just fine.
Maybe an overlook over the complete code could help. (Excuse the codemess)
Also i've got a small sidequestion:
I'm using async: false to make the whole thing work, if i remove it, nothing will be shown. But as i know that this is deprectaed, what alternatives do i have?
Thank you very much.
there is no element with ID of input in your HTML, i think you want to change the value of input elements, change this:
$('#input').val("Text") ; // this is an ID selector
to
$('input').val("Text") ;
#input searches for an element with id input. I did not see any on the source code.
As you want to change text of a single input field , give it an unique id. Like id='sampleText' then change its value like ,
$("#sampleText").val("Your text");
Your code has some errors please check.
<form id="editForm" method="POST" action="updatedata.php">
**<input type="text" id="editHeading" name="editHeading" /></textarea><br>**
<textarea id="editAuthor" name="editAuthor" /></textarea><br>
<textarea id="editTag" name="editTag" type="text" /></textarea><br>
<textarea id="editarea" name="editarea"></textarea><br>
<input id="id" name="id">
<input id="submitEditForm" name="submitEditForm" type="submit" /><br>
</form>
FYI some general concepts
$('input').val('foo'); //updates with value foo for all input elements
$('#input').val('foo'); //updates with value foo an input element with id #input
$('span#a').val('foo'); //wont work ,here we have to use .html
$('span#a').html('foo'); //<span>foo</span>
Hell...
i found it. It's not like the value isn't be inserted, it's just not visible O_o
MY Chrome does not show the word "test" inside the input when it is hidden by jQuery before.
With FF, everything works just fine.

Language selection using images in PHP

I have found an open source PHP script that uses a select menu to choose the language.
In the code session makes use of a loop to fill in the select menu, as above...
$la = 0;
foreach($trans['languages'] as $short=>$langname) {
$params['LANGSEL'][$la]['LANG_SHORT'] = $short;
$params['LANGSEL'][$la]['LANG_LONG'] = $langname;
$la++;
}
In the php template creates the select menu like that...
<td><select class="select" name="lang"><#FOR LANGSEL#>
<option value="<#LANG_SHORT#>"><#LANG_LONG#></option>
<#/FOR LANGSEL#></select></td>
So this code works fine but i find it kinda ugly so i am trying to make an image input instead
So i thought something like that would work..
<input type="image" name="lang" value="http://localhost/index.php?lang=en" src=" <#IMAGES_DIRECTORY#>/english.png"></td>
<input type="image" name="lang" value="http://localhost/index.php?lang=it" src=" <#IMAGES_DIRECTORY#>/italian.png"></td>
But nothing changes, the page always shows up in italian that is the default language..
Thanks in advance from a newbie that is struggling to learn some html and php.
The value of your name field should be <#LANG_SHORT#>. You don't say what it looks like after being processed but I'm pretty sure it's something like en or it. However, you provide a URL. You also prepend several white spaces to the image's URL.
This will probably work:
<input type="image" name="lang" value="<#LANG_SHORT#>" src="<#IMAGES_DIRECTORY#>/english.png"></td>
Remember to test it in Internet Explorer. It's traditionally had several problem with <input type="image"> elements.
The problem here is that you have two images with different names, whereas you need to only have one form element, called name, whose value is the correct <#LANG_SHORT#> string. In this regard, select and radio form elements are perfectly suited to the job, whereas inputs are not.
It also seems unlikely to me that the form element really has a value of http://localhost/index.php?lang=en. Isn't that merely the URL that results from changing the language? It seems more likely that the proper value for your form fields is just en/it.
Ultimately, I reckon you're going to need a hidden form field, and some Javascript on your images to set that field's value when required. And be aware that the usability/accessibility of your site just went from [potentially] high to [definitely] very low.

Can I include a forms value into the action redirect in php?

Is it possible in php to include a forms value into the action redirection?
For example:
<form method='POST' name='Select' action='customer.php?CID=xxxxx'>
<input type=text width='5' name='searchVal' />
where xxxxx is the value entered into the form.
I've tried a number of different ways and I'm just not figuring it out! (Still sort of new to php) Any help would be appreciated.
It was looking like I would have to use $_POST and $_GET. A little more information might be in order... customer.php displays a list of customers in order by ID, name, etc. The user currently clicks on the customer ID that they want to display the details for. I'm trying to add a box where they can just enter the customer number to get to the details quickly, but I still want to have the listing displayed. From what it is sounding like, I will have to do this as two separate programs...is that true?
How about this:
<form method='POST' name='Select' action='customer.php'>
<input type='hidden' value='xxxxx' name='CID' />
<input type=text width='5' name='searchVal' />
...
</form>
You are free to add as much hidden values as needed.
Note, that you can even use PHP-like array notation_
<input type='hidden' value='xxxxx' name='CID[1]' />
<input type='hidden' value='yyyyy' name='CID[2]' />
At the PHP-side, access those values using this syntax:
$_POST[ 'CID' ][ 1 ]
$_POST[ 'CID' ][ 2 ]
UPDATE-1
Ah, you want to use a user-entered values to the Action URL just before the form gets submitted?
In this case you need to use JavaScript. Access the DOM to change the Action URL.
But let me ask, why you need to post a form value additionally as a parameter of the Action URL?
UPDATE-2
You wrote: 'From what it is sounding like, I will have to do this as two separate programs...is that true?'
No, actually not. You can still use one customer.php which checks at its beginning, if it was called using a linked customer in the table element or a searched customer in the search field.
In other words: You don't need to prepare two scripts, but two forms for two purposes which call the same script customer.php.
You can include the required value in a hidden field in your form:
<input type="hidden" name="CID" value="xxxxx" />
The reason this is required is that you are submitting the form to your server via POST, but appending parameters to the URL requires submission via the GET method.
Not without a post to the server. The value in the form is filled in client-side, so it has to return to the server before you can add it to the action. (at least, if you want to use php).
You can either
add it after posting (might not be usefull)
use javascript
just not use the GET CID, but get it out of the POST in your customer.php script.
I got it finally! It's actually very simple!
In the body of the code I put this:
<form action='#_SELF' method='GET' name='Projected'>
<input type=text size=5 name='CID' value='' title='Enter Customer number to display' />
<a href='#' onclick='document.Projected.submit();' title='Enter Customer number to display'>Go</a>
And at the top of the code I just do a:
if (!isset($_GET['CID'])) { ...
It works exactly the way I wanted it to!
Thanks everyone for the help! I appreciate it! (And I'm learning more and more about PHP everyday!)
Im pretty sure you cant do that unfortunately

Cloning or adding an input to a form in jQuery does not submit to PHP in Firefox

$('#images_upload_add').click(function(){
$('.images_upload:last').after($('.images_upload:last').clone().find('input[type=file]').val('').end());
});
using this code to append file input's does not upload the file in firefox.
also
$('#image_server_add input[type=button]').click(function(){
var select = $(this).siblings('select').find(':selected');
if(select.val()){
$('#image_server_add').before('<tr class="images_selection"><td><input type="button" value="Delete"></td><td class="main">'+select.html()+'<input type="hidden" value="'+select.html()+'" name="images_server[]"/></td></tr>');
}
})
also does not upload the values to the $_POST
I can't find anything to say why this wouldn't work in the documentation, this works in IE but not it Firefox/WebKit
Why wouldn't these examples correctly upload the form values?
Bottom line the markup on the page was mangled.
The form was in a table based layout, not by my choice, and the form declaration was inside a tr.
I moved the form declaration to a parent td of the form inputs and now it works.
This is an interesting result considering the rendering engine will correctly submit inputs that are improperly placed, but attempting to add those inputs using jQuery/javascript? into the same place will not work in Firefox/WebKit.
I imagine this has to do with the dom manipulation that javascript does and how it may be more strict about the block level element requirements.
Any more notes/conjectures about my findings would be appreciated.
Are you having the same problem if you create a new input rather than cloning an existing one?
Are you changing the name of the cloned input to avoid name collisions or are you using an array style name (e.g. file[])?
What is the purpose of adding the markup of the selected option to a hidden input?
For fun, have you tried using .clone(true)?
Wow! Sometimes jQuery can actually be too dense to read. Would also help if we could see your markup.
Stab in the dark here because I'm guessing at what you're trying to do.
You can't programmatically enter a filename into a file field and it be uploaded to the server. That would be dangerous.
Perhaps I'm barking up the wrong tree?
Maybe rather than adding the element just as the form is submitted, put the element in, but with default values.
Then when the button is clicked, populate that element with the right value.
I just say that because by the time you click on the submit, it might be too late for the added element to be submitted along with the form.
I got to this section from google searching a similar problem.
To me, I was able to fix it by taking a step back at the problem -
in a example form:
<table>
<form method="post">
<tr>some content <input type="text" name="test"> </tr>
</form>
</table>
This will work in Internet explorer for some reason, but it is actually invalid html.
Move the form tags to outside the table, like so:
<form method="post">
<table>
<tr>some content <input type="text" name="test"> </tr>
</table>
</form>
And it will then work.
The input's will work fine (even dynamicly) this way, I was having a lot of trouble where a form would work, until you inserted more inputs or form elements - only the original elements would submit, which was very hard to track.

Categories