jQuery removing characters after apostrophe when sending string from HTML to jQuery - javascript

I am trying to pass a variable, a first name with an apostrophe, from HTML to jQuery. By the time the value gets to jQuery, the string is missing all the characters after the apostrophe.
Name Example: Test'Ing
This is part of the form. I fill the list dynamically and the name appears correct when pulled from the database:
<?php echo "<select id='hiringManager' class='dropdown_form' name='hiringManager'>";
echo "<option disabled selected>Hiring Manager</option>";
while ($result_row = mysqli_fetch_row($hiring_manager_query)) {
echo "<option value='" . $result_row[0] . "'>" . $result_row[0] . "</option>";
}
echo "</select>" ?>
And then I get the value from the form and display it in a jQuery modal for confirmation:
$('#hiringManagerModal').text($('#hiringManager').val());
The resulting text shown is:
"Test" instead of "Test'Ing"
I have poked around but have not been able to find a post that addresses this, or I could not be phrasing the issue correctly in the search.
Any help is appreciated. Thanks!

The problem is with the PHP code. I have replaced the 's with "s and "s with 's. The outputted HTML earlier was,
<select id='hiringManager' class='dropdown_form' name='hiringManager'>
<option disabled selected>Hiring Manager</option>
<option value='test'ing'>test'ing</option> <!-- In this option, the value is test instead of test'ing -->
</select>
and now after all the replacements, it is,
<select id="hiringManager" class="dropdown_form" name="hiringManager">
<option disabled selected>Hiring Manager</option>
<option value="test'ing">test'ing</option><!-- Now, here the value is test'ing, as required -->
</select>
What really happens is that when ' is encountered, the string gets terminated and as a result only "test" gets outputted instead of "test'ing".
The corrected PHP code after all the replacements:
<?php
echo '<select id="hiringManager" class="dropdown_form" onchange="displayInModal();" name="hiringManager">';
echo '<option disabled selected>Hiring Manager</option>';
while ($result_row = mysqli_fetch_row($hiring_manager_query)) {
echo '<option value="' . $result_row[0] . '">' . $result_row[0] . '</option>';
}
echo '</select>'
?>
with,
$('#hiringManagerModal').text($('#hiringManager').val());
Now, the same problem would arise with
<option value="test"ing"></option>
Other way:
echo '<option value='test\'ing'></option>';

Related

Displaying the other values in the table on select option from database

i have a select option, after selecting a brand I successfully get/display the brand name but I want also the other values be displayed like price, with or without refreshing the page.
<?php
require_once 'config.php';
echo '<select class="form-control action" name="tran_description" value="<?
php echo $tran_description; ?>" style="background-color:#F0F0F0">';
$sql = mysqli_query($mysqli, 'SELECT * FROM products order by product_id');
while ($row = $sql->fetch_assoc()){
echo '<option id="' . $row['product_id'] . '"';
echo ' value="' . $row['description'] . '" ';
echo ' value="' . $row['price'] . '" ';
if($row['description'] == $tran_description) {
if($row['price'] == $tran_price) {
$tran_price = $row['price'];
echo ' selected="selected"';
}
}
if($row['product_id'] == $row['description']) {
echo ' selected="selected"';
}
echo '>';
echo $row['description'];
echo '</option>';
}
echo '</select>';
?>
I can get the value of the description but the price I couldnt. In one select option representing the brand or description I want also the price value of that brand I selected be assign to a variable so I can do arithmetic operation in the back code without seeing it.Thanks.
You are using wrong HTML structure only the first attribute is being used while the other is being ignored in the DOM .The right way to store multiple values in a single select can be like this:
<select name="">
<option value="{'num_sequence':[0,1,2,3]}">Option one</option>
<option value="{'foo':'bar','one':'two'}">Option two</option>
</select>
In your case it should be like this:
echo '<option id="' . $row['product_id'] . '"';
// echo ' value="{ /"description:/"' . $row['description'] . ', /"price:/"' . $row['price'] . ' }" ';
echo ' value="' .
json_encode(['description'=>$row['description'], 'price'=>$row['price']) .
'">";
Then to get the value you'll do is:
$description = $_POST['NameOfSelectInput']['description'];
$price = $_POST['NameOfSelectInput']['price'];
If you want to get the value in javascript, using jQuery, for example, you could do:
var value = JSON.parse($('#select_id').val()); // use id of your select control
var price = value.price;
var description = value.description;
You should do appropriate error checking...
For more details refer here:
Can an Option in a Select tag carry multiple values?

how to change a value of a php variable with ajax or jquery?

so I make a small php app and I try to use ajax.
I have two lists :
<select name="auteur" id="auteur" >
<option value='-1'>Aucun auteur</option>
<?php
require("bd/bd.inc.php");
$resA = listeAuteurs();
while ($rowA = $resA->fetch()) {
echo "<option value='" . $rowA["id"] . "'>" . $rowA["nom"] . "</option>";
}
?>
</select>
And
<select id="livre" name="livre">
<option value="-1">
Aucun livre
</option>
<?php
$idAuteur = NULL;
require("bd/bd.inc.php");
$resL = listeLivres($idAuteur);
while ($rowL = $resL->fetch()) {
echo "<option value='" . $rowL["idLivre"] . "'>" . $rowL["titre"] . "</option>";
}
?>
</select>
In my ajax.js file I get the value of the slected option of the first list with this code :var validauteur = $( "#auteur" ).val();
And what I want is to modify the value of the variable "$idAuteur" in the second list with the value of the selected option of the first list.
Hope you can help.
You can't use AJAX to edit the PHP variable of a page that has already loaded - but you can use AJAX to trigger a JS function (on success) which will edit the second input.
In your AJAX success return, add some JS code to edit the second select box:
$( "#livre" ).html(...);
What you actually want to change it to is upto you.

PHP dropdown populated by database. Keep value after 'onchange' form submit

I have a drop down list that is populated by calling another PHP file who's values are taken from a database. The functionality works but I would like to retain the value selected once the onchange form submit happens.
I have had success by using the following for a static lists but not sure how I can get it to work for a dynamic list that is obtained from a database
<option value="company" <?php if($_GET['sort']== 'company') echo 'selected="selected"';?>>Company</option>
Here is the HTML code for the select
<select name="client" id="client" onChange='this.form.submit()'>
<option value="default"></option>
<option value="all">----- ALL CLIENTS -----</option>
<?php
include("sql_clients.php");
?>
And here is part of the the sql_clients.php code
if (sqlsrv_has_rows($result)) {
while( $row = sqlsrv_fetch_array($result))
{
echo ('<option value="' .$row[CompanyName] . '">' . $row['CompanyName'] . "</option>" ."\n" ."\t" ."\t" ."\t" ."\t" ."\t");
}
}
Thanks
Its the same thing, just now instead of one hardcoded value, use the variable:
while( $row = sqlsrv_fetch_array($result))
{
echo '<option value="' .$row['CompanyName'] . '"';
if($_GET['sort']==$row['CompanyName'])
{
echo ' selected="selected"';
}
echo '>' . $row['CompanyName'] . "</option>" ."\n" ."\t" ."\t" ."\t" ."\t" ."\t";
}
Also $row[CompanyName] should be $row['CompanyName']

Drop down menu in PhP javascript html

Need your help in my application i have a php page (profile.php) that give me this result:
Test1/Test
Test2/Test0
...
I want to put each line in this result in a selection bar like this one:
but in fact the result was like this one :
this is my code for m drop down menu:
<option value="0">please select an existing profile</option>
<?php
require('profile.php');
?>
code profile.php:
<?php
$output = shell_exec('/etc/init.d/dima --get-profilelist');
echo "<option value=\"" . $output ."\">".$output."</option>";
?>
Your result should looks like :
<option value="0">please select an existing profile</option>
<option value="1">Test1/Test</option>
<option value="2">Test2/Test0</option>
Yours is like that :
<option value="0">please select an existing profile</option>
<option value="0">Test1/Test Test2/Test0</option>
You have to enclose each result line in the tag so that it can work as expected
$output is taking all the content in one line...you can use var_dump() to see how data is returned in $output and edit that... You need to use for each value in the dropdown
You should loop your $output and echo every option, Try This :
<?php
$output = shell_exec('/etc/init.d/dima --get-profilelist');
$optionsArray = explode(' ',$output);
foreach(optionsArray as $option)
echo "<option value='". $option."'>".$option."</option>";
?>
Hope this will help.

How can I properly decode a javascript encoded URI in PHP?

I've created a dynamic dropdown using JS/PHP/MySQL but it seems I'm having some problems with UTF8 decoding in my PHP. The script is going to be used to make a small application that helps my customers find a product that meets their criteria. We sell panel meters that can accept different ranges of input and many are denoted with a +/- or a value (example: a meter can expect to process a voltage +/- 10V around a specified voltage.) Everything is starting to work great in my script except when some characters are parsed through (+, / , ±, ½, etc.) My database originally used ± to denote plus or minus but I then switched to +/- (three characters) in hopes that it would fix the special character problem but it didn't...
Using console.log I've figured out that my JS is encoding the special characters correctly but once it gets to my PHP it doesn't decode properly.
Everything along the way is set to UTF8
So now I still need to figure out why some things are not parsing right.
You can view a live version of the script at http://new.foxmeter.com/find.php.
This is the important part of my frontend
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(function(){
$("#type").change(function() {
var tval = document.getElementById('type').value;
$("#range").load(encodeURI("findbackend.php?type=" + tval));
});
$("#range").change(function() {
rval = document.getElementById('range').value;
$("#power").load(encodeURI("findbackend.php?range=" + rval));
console.log(encodeURIComponent(document.getElementById('range').value));
});
$("#power").change(function() {
//var rval = document.getElementById('range').value;
psval = document.getElementById('power').value;
$("#setpoint").load(encodeURI("findbackend.php?range=" + rval + "&power=" + psval));
});
$("#setpoint").change(function() {
//var rval = document.getElementById('range').value;
//var psval = document.getElementById('power').value;
stval = document.getElementById('setpoint').value;
$("#output").load(encodeURI("findbackend.php?range=" + rval + "&power=" + psval + "&setpoint=" + stval));
});
});
</script>
</head>
<body>
<!-- Google Analytics Script -->
<?php include_once("scripts/analyticstracking.php") ?>
<div class="wrapper"> <!-- Sticky Footer Wrapper -->
<div id="panorama"></div>
<div id="header">
<?php include("include/header/banner.php") ?>
<?php include("include/header/nav.php") ?>
<?php include("include/header/quicksearch.php") ?>
</div>
<div id="content">
<div id="findoptions">
<select id="type" class="finddrops">
<option selected value="base">Please Select</option>
<option value="DC Voltage">DC Voltage</option>
<option value="DC Current">DC Current</option>
<option value="AC Voltage">AC Voltage</option>
<option value="AC Current">AC Current</option>
<option value="Strainguage">Strainguage</option>
</select>
<br>
<select id="range" class="finddrops">
<option>Please choose from above</option>
</select>
<br>
<select id="power" class="finddrops">
<option>Please choose from above</option>
</select>
<br>
<select id="setpoint" class="finddrops">
<option>Please choose from above</option>
</select>
<br>
<select id="output" class="finddrops">
<option>Please choose from above</option>
</select>
<br>
<select id="blarg" class="finddrops">
<option>Please choose from above</option>
</select>
</div>
<div id="findresults" class="finddrops">
</div>
</div>
</div>
And this is my PHP running on the backend:
<?php
//\\ MODULAR DEPENDANT DROPDOWNS \\//
//creates DB connection
$dbHost = 'host';
$dbUser = 'user';
$dbPass = 'password';
$dbDatabase = 'database';
$con = mysql_connect($dbHost, $dbUser, $dbPass) or trigger_error("Failed to connect to MySQL Server. Error: " . mysql_error());
mysql_select_db($dbDatabase) or trigger_error("Failed to connect to database {$dbDatabase}. Error: " . mysql_error());
//prevents injections
//any order
$type = mysql_real_escape_string(urldecode($_GET['type']));
isset($_GET['range'])?$range = mysql_real_escape_string(urldecode($_GET['range'])):"";
isset($_GET['power'])?$power = mysql_real_escape_string(urldecode($_GET['power'])):"";
isset($_GET['setpoint'])?$setpoint = mysql_real_escape_string(urldecode($_GET['setpoint'])):"";
//forms the query depending on what data is recieved through GET
//first option on the bottom; last option on the top to avoid conflicts
if (isset($_GET['setpoint'])) {
$query = "SELECT DISTINCT stp FROM meters WHERE sio='$range' AND pso='$power' AND stp='$setpoint' ORDER BY model";
} elseif (isset($_GET['power'])) {
$query = "SELECT DISTINCT stp FROM meters WHERE sio='$range' AND pso='$power' ORDER BY model";
} elseif (isset($_GET['range'])) {
$query = "SELECT DISTINCT pso FROM meters WHERE sio='$range' ORDER BY model";
} else {
$query = "SELECT DISTINCT sio FROM meters WHERE sit LIKE '%$type%' ORDER BY model";
}
//creates a result array from query results
$result = mysql_query($query);
//outputs dropdown options dependent on what GET variables are set
//first option on the bottom; last option on the top to avoid conflicts
if (isset($_GET['setpoint'])) {
while ($row = mysql_fetch_array($result)) {
echo "<option value='" . $row{'stp'} . "'>" . $row{'stp'} . "</option>";
}
} elseif (isset($_GET['power'])) {
echo "<option>Choose Setpoint Options</option>";
while ($row = mysql_fetch_array($result)) {
$row{'stp'} = ucfirst($row{'stp'}); //capitalizes the first letter; necessary?
echo "<option value='" . $row{'stp'} . "'>" . $row{'stp'} . "</option>";
}
} elseif (isset($_GET['range'])) {
while ($row = mysql_fetch_array($result)) {
echo "<option value='" . $row{'pso'} . "'>" . $row{'pso'} . "</option>";
}
} else {
while ($row = mysql_fetch_array($result)) {
echo "<option value='" . $row{'sio'} . "'>" . $row{'sio'} . "</option>";
}
}
//Thanks to Chris Coyier for the wonderful examples on CSS-Tricks
//A Web Application by Zach Klemp
?>
Again, you can view the script here.
Choose DC Voltage in the first dropdown and then a +/- option in the second the see where the problem begins. When you choose Straingauge in the first dropdown and then click '30 mV with 10 V DC excitation' it parses through fine. (And as an aside another problem I have is that choosing the first result without clicking another first doesn't trigger the .change)
Thanks for any and all help getting this to work! I've been trying to figure this out for a bit now and haven't come up with a solution.
Try this in your PHP file :
Replace any echo XXXX; with utf8_decode(XXXX)
It should make it works
$string = ';http%3A%2F%2Fwww.google.com%2F%3Fq%3Dtesting%2Burldecode';
echo urldecode($string); // http://www.google.com/?q=testing+urldecode
For further reading, see the official PHP documentation on urldecode here.

Categories