CODEWITHSUNDEEP
phpjqueryhtmlmysql
BR89
BR89

Reputation: 716

Setting specific table cell value into textbox (jQuery / PHP)

I have 1 table with 2 columns. We'll call it col Number and col Letter. It appears as such:

1  |  A
2  |  B
3  |  C
4  |  D

I have 1 select2 drop down box that has a loop of all the Numbers - and a text box I would like to have the Letter appear that correlates with that number.

HTML/PHP querying current table

<label for="number">NUMBER</label>
<select onChange="setLetter(this)" style="text-transform: uppercase;" class="form-control select2" style="width: 100%;" name="number" id="number">
    <option selected="selected" disabled="disabled">-Select-</option>

    <?php
    if ($result->num_rows > 0) {
        // output data of each row
        while($row = $result->fetch_assoc()) {
            echo "<option name='".$row["Number"]."' value='".$row["Number"]."'>";
            echo $row["number"];
            echo "</option>";
        }
    } else {
        echo "0 results";
    }
    $conn->close();
    ?>
</select>
</div>

JavaScript attempt at querying the value of the select2 box

function setLetter(sel)
{
    var col = sel.value;
    <?php
    $number = "SELECT ['Letter'] FROM `msftrail` WHERE ['Number']= '".$col."'";
    ?>
    var php_var = "<?php echo $number; ?>";
    $("#letter").val(php_var);
}

How can I populate the Letter text box with the cell in the table that correlates with the correct number?

Upvotes: 1

Views: 341

Answers (3)

remram
remram

Reputation: 5202

The easiest here would be to put all those rows in an array, and serializing it as JSON. Then you can load it up on the client.

HTML+PHP:

$msftrail = array();
while($row = $result->fetch_assoc()) {
    echo "<option name='".$row["Number"]."' value='".$row["Number"]."'>";
    echo $row["number"];
    echo "</option>";
    $msftrail[$row['Number']] = $row['Letter']; // Store the mapping from Number to Letter in this array
}

JavaScript+PHP:

var msftrail = <?php echo json_encode($msftrail); /* Send the array to the client as JSON */ ?>;
function setLetter(sel)
{
    var col = sel.value;
    var php_var = msftrail[col]; // Look up the letter for that number in the array
    $("#letter").val(php_var);
}

Upvotes: 1

Eaimie
Eaimie

Reputation: 45

function setLetter(sel){
	var tableValue=sel.value
	
	$('.item tr').each(function() {
    var td1 = $(this).find("td").eq(0).html();  
	var td2 = $(this).find("td").eq(1).html();  
	if(tableValue==td1){
   
	$('#out').text(td2);
	}
});
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<table class="item">
	<tr>
		<td>1</td>
		
		<td>A</td>
	</tr>
	<tr>
		<td>2</td>
		<td>B</td>
	</tr>
	<tr>
		<td>3</td>
		<td>C</td>
	</tr>
	<tr>
		<td>4</td>
		<td>D</td>
	</tr>

</table>
<form>
	<select onChange="setLetter(this)">
		<option>1</option>
		<option>2</option>
		<option>3</option>
		<option>4</option>
	</select>
	<br>
	<textarea id="out"></textarea>
</form>

Upvotes: 0

KrisKodira
KrisKodira

Reputation: 53

You could create an Array with all your characters and then call the corresponding character by index.

Like this: 

$foo = array(
             '1' => 'A',
             '2' => 'B',
             '3' => 'C'
);

Then you can just get your character by calling your array with the index.

Like this:

echo $foo['1'];

Upvotes: 0

Related Questions