Develop Reference

How do I output php code in a js innerhtml?

I have a dropdown field and a text field in my form.
Whenever a user presses a button, I want it to show both fields twice.
I'm doing the js part with an innerHTML and I want to output the php include to the file with the code for both fields. Now for some reason, I can't output php code with innerHTML.
Can someone explain why and how I can solve it. The file with the code for the fields has PHP and sql in it, so I can't just put the code in "" after the innerHTML.
function addInput()
{
var boxName='textBox'+countBox;
document.getElementById('stops').innerHTML+="<?php include'arrivalField.php;'?>";
countBox += 1;
}
When I press the button with the code like this, nothing happens. If I change the innerHTML="" thing to "Hello, world" it does work. It's specifically because it's PHP.
arrivalField.php contains
<div class='dropdown'><label for='pwd'>Vehicle:</label><select name='vehicle' id='vehicle' class='form-control'>
<?php
//For each car that user has, add it to the top of the dropdown.
$fetchCars = 'SELECT idCar, brandName, modelName FROM car WHERE idAcc = \''.$_SESSION[UserID].'\'';
$cars = $conn->query($fetchCars);
if(!empty($cars)){
$row = mysqli_fetch_array($cars);
foreach ($cars as $car) {
echo '<option class=\'dropdown-item\' value=\'Car\'.$car[idCar].\'>'.$car[brandName].' '.$car[modelName].'</option>';
}
}
?>
<option class='dropdown-item' value='Bicycle'>Bicycle</option>
<option class='dropdown-item' value='Long-distance bus'>Long-distance Bus</option>
<option class='dropdown-item' value='City bus'>City bus</option>
<option class='dropdown-item' value='Plane'>Plane</option>
<option class='dropdown-item' value='Train'>Train</option>
<option class='dropdown-item' value='Foot'>Foot</option>
<option class='dropdown-item' value='Subway'>Subway</option>
<option class='dropdown-item' value='Tram'>Tram</option>
</select>
</div>
<br>

First of all, I guess you not fully understand, that PHP executes strictly before javascript, and in your situation, you try to generate js code from PHP. Therefore it's very important to put this code in the right place. I mean, for example, if you put this code to the .js file it will not be preprocessed with PHP (with default server configuration). It may be essential.
Secondly, it's very important to understand, that the output of your PHP code must be specially prepared to will be compatible with js syntax. For example, if your PHP code outputs double quote (") it may be a problem, so you will get js syntax error. You can check this by using the client js debugger.

Django - Calling ManytoMany Field inside jQuery

I am using Django Model field values inside a Javascript file by using the following code:
var action_type =$('#id_strength').val();
Here strength is a Charfield.
But the same doesn't work for a ManytoMany Field
var action_type =$('#id_batches').val();
Batches:
When I viewed the source code, the HTML looks like this:
<div class="related-widget-wrapper">
<select name="batches" data-field-name="batches" multiple="multiple" id="id_batches" data-is-stacked="0" class="selectfilter">
<option value="option1">option1</option>
<option value="option2">option2</option>
</select>

So I did some digging and was finally able to get the JQuery to access the field. Since it is a ManytoMany select field, I just had to treat the batches as a select field.
var action_type = []
$("#id_batches").each(function(name,val) {
action_type.push(val.value);
});
Thanks Daniel Roseman for pointing me to right direction

Passing variable to a PHP page with Spaces

I have a select element as shown below.I am passing the value of the selected option to a PHP page as a variable with javascript as shown below :
<script>
var area1=document.getElementById("area").value;
$("#list").load("selectcity.php?city1="+city1+"&area1="+area1);
<script>
<select id="areas" name="areas">
<option value="Queens Town">Queens Town</option>
<option value="QueensTown">QueensTown</option>
</select>
Now the thing is , In the PHP page I am able to echo $_GET['area1']; when QueensTown is selected but whenever I am trying to pass Queens Town ,its now working.Can anybody help.

You have to escape the values properly, otherwise you would end up with a URL like this:
selectcity.php?city1=xyz&area1=Queens Town
Which is unlikely to work the way you want. Use this instead:
var data = {
city1: city1,
area1: $('#areas').val()
};
$('#list').load('selectcity.php?' + $.param(data));
See also: jQuery.param()

How to load a text file using JavaScript with a HTML combobox (<select>)?

First of all, thanks for reading the topic.
Now, I'm making a website using HTML5 and I need to load a text file according to the user choice in a combobox. I mean, the user selects an option from the combobox and the text from it should shown on a specific cell of a table. The number of times that the user wants without refreshing the site.
The problem is that the code is not working. The code:
The HTML for the combo box:
<select id = "comboSelect">
<option value="text1.txt">text1</option>
<option value="text2.txt">text2</option>
<option value="text3.txt">text3</option>
<option value="text4.txt">text4</option>
<option value="text5.txt">text5</option>
</select>
The HTML for the table cell:
<td colspan="5" class="text" id = "cuadroTexto"></td>
The JavaScript that does the rest of the work:
$(document).ready(function(){
document.getElementById("comboSelect").addEventListener('change',function () {
$(document.getElementById("cuadroTexto")).load(value);
alert("Cargado");
},false);
});
Edit 1:
I think that the JavaScript is not recognizing the change event from the combobox.
I'm yet not working with a server.

Check this is working
CODE
$(document).ready(function(){
$("#comboSelect").change(function () {
$("#cuadroTexto").load(this.value);
alert($(this).val())
});
});
Fiddle http://jsfiddle.net/krunalp1993/Qr6GK/

using a variable from drop down list

I'm attempting to create a dynamic drop down list, but after searching for hours I'm still completely stumped as to how to do it. So I am experimenting with variables in a list. This is the code I've started with.
<body>
<form method = "post">
<select id = "State" onchange = "a = this.options[selectedIndex].value;">
<option value = ""> Select a state</option>
<option value = "S3"> Pennsylvania</option>
<option value = "S4"> California</option>
<option value = "I4"> Texas</option>
<option value = "I5"> New York</option>
</select>
</form>
</body>
my question is what can I do with the variable 'a' so that I could create a dynamic drop down list based off it? One thing I had hoped to do was use an if-statement to display a second list. I wanted to remain on the same page too.
Note: I apologize if this seems like a basic question, but I've been scouring websites for answers and all I've figured out was that I can't send javascript variables to php, otherwise I'd have gotten this done forever ago

try this way
<select id="appamt" name="appamt">
<? while($amt=mysql_fetch_array($amount)){ ?>
<option value="<?=$amt['amount']?>"><?=$amt['amount']?></option>
<? } ?></select>

When your page detects the onchange event, what you need to do is either have all the combinations of options you want readily available but hidden on the page e.g. $('#sub-option1).hide(); and when the value is selected use $('#sub-option1).show();
Secondly you can have a ajax request that returns a JSON value of key=>value pairs, then use these key value pairs to dynamically build another dropdown using jquery .each() function.
Loop through your json values and add them to a previously hidden selector and then display it.
Hope this helps but if not email me and I will skype you through it.
Jim C