why my script doesn't get value that I purpose

Question

in my web there are table content that i give a static value like this

<?php
include 'config/koneksi.php';
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Lay Out Penempatan Produk UHT Area Gudang Rak A-F</title>
<link rel="icon" href="http://localhost/wifi/images/RSUP.png">
<link rel="stylesheet" type="text/css" href="css/popup-window.css" media="screen">

<script type="text/javascript" src="js/popup-window.js"></script>
<script type="text/javascript" src="js/jquery-1.8.3.js"></script>



<script>
    function setvalue(values) {
    document.getElementById('posisi').value = values;
}
</script>

<script type="text/javascript">
var htmlobjek;
$(document).ready(function(){
  //apabila terjadi event onchange terhadap object <select id=pid>
  $("#pid").change(function(){
    var pid = $("#pid").val();
     $.ajax({
        url: "ambilnamaproduk.php",
        data: "pid="+pid,
        cache: false,
        success: function(data){
        $("#pname").val(data);
        }
        });
    });
  });
</script>

<script>
var i = $("#myTD").val();
    alert(i);
</script>

<script type="text/javascript">
var htmlobjek;
 $(document).ready(function () {
var i = $("#myTD").val();
      $.ajax({
             url: "cek.php",
             type:'POST'
             data: "i="+i,
             cache: false,
             success: function (data) {
                 $("#cek").val(data);
             }

        });            
});
 var k = $("#cek").val();
if(k = "0"){
 $(document).ready(function () {
                 $(".data").css("background-color", "#00CC00");//green
                 });
                 }
    else{
 $(document).ready(function () {
                 $(".data").css("background-color", "#FF0000");//red
                 });
}                 
 </script>

</head>
<body>
<div>
<input id="cek" name="cek" type="text" />

<table width="1023" border="1">
  <tr>
    <th colspan="2">A1</th>
    <th colspan="2">A2</th>
    <th colspan="2">A3</th>
    <th colspan="2">A4</th>
    <th colspan="2">A5</th>
    <th colspan="2">A6</th>
    <th colspan="2">A7</th>
    <th colspan="2">A8</th>
    <th colspan="2">A9</th>
  </tr>
  <tr>
    <td class="data"> <div align="center"> <input type="button" onclick="popup_window_show('#sample', { pos : 'tag-right-down', parent : this, width : '270px' });setvalue(this.value);" id="myTD" name="myTD" value="A1.4" /></div></td>
    <td class="data"><div align="center"><input type="button" onclick="popup_window_show('#sample', { pos : 'tag-right-down',   parent : this, width : '270px' });setvalue(this.value);" value="A1.8" /></div></td>
    <td><div align="center"><input type="button" onclick="popup_window_show('#sample', { pos : 'tag-right-down',   parent : this, width : '270px' });setvalue(this.value);" value="A2.4" /></div></td>
    <td><div align="center"><input type="button" onclick="popup_window_show('#sample', { pos : 'tag-right-down',   parent : this, width : '270px' });setvalue(this.value);" value="A2.8" /></div></td>
    <td><div align="center"><input type="button" onclick="popup_window_show('#sample', { pos : 'tag-right-down',   parent : this, width : '270px' });setvalue(this.value);" value="A3.4" /></div></td>
    <td><div align="center"><input type="button" onclick="popup_window_show('#sample', { pos : 'tag-right-down',   parent : this, width : '270px' });setvalue(this.value);" value="A3.8" /></div></td>

    <td><div align="center">A4.4</div></td>
    <td><div align="center">A4.8</div></td>
    <td><div align="center">A5.4</div></td>
    <td><div align="center">A5.8</div></td>
    <td><div align="center">A6.4</div></td>
    <td><div align="center">A6.8</div></td>
    <td><div align="center">A7.4</div></td>
    <td><div align="center">A7.8</div></td>
    <td><div align="center">A8.4</div></td>
    <td><div align="center">A8.8</div></td>
    <td><div align="center">A9.4</div></td>
    <td><div align="center">A9.8</div></td>
  </tr>
  <tr>
    <td><div align="center">A1.3</div></td>
    <td><div align="center">A1.7</div></td>
    <td><div align="center">A2.3</div></td>
    <td><div align="center">A2.7</div></td>
    <td><div align="center">A3.3</div></td>
    <td><div align="center">A3.7</div></td>
    <td><div align="center">A4.3</div></td>
    <td><div align="center">A4.7</div></td>
    <td><div align="center">A5.3</div></td>
    <td><div align="center">A5.7</div></td>
    <td><div align="center">A6.3</div></td>
    <td><div align="center">A6.7</div></td>
    <td><div align="center">A7.3</div></td>
    <td><div align="center">A7.7</div></td>
    <td><div align="center">A8.3</div></td>
    <td><div align="center">A8.7</div></td>
    <td><div align="center">A9.3</div></td>
    <td><div align="center">A9.7</div></td>
  </tr>
  <tr>
    <td><div align="center">A1.2</div></td>
    <td><div align="center">A1.6</div></td>
    <td><div align="center">A2.2</div></td>
    <td><div align="center">A2.6</div></td>
    <td><div align="center">A3.2</div></td>
    <td><div align="center">A3.6</div></td>
    <td><div align="center">A4.2</div></td>
    <td><div align="center">A4.6</div></td>
    <td><div align="center">A5.2</div></td>
    <td><div align="center">A5.6</div></td>
    <td><div align="center">A6.2</div></td>
    <td><div align="center">A6.6</div></td>
    <td><div align="center">A7.2</div></td>
    <td><div align="center">A7.6</div></td>
    <td><div align="center">A8.2</div></td>
    <td><div align="center">A8.6</div></td>
    <td><div align="center">A9.2</div></td>
    <td><div align="center">A9.6</div></td>
  </tr>
  <tr>
    <td><div align="center">A1.1</div></td>
    <td><div align="center">A1.5</div></td>
    <td><div align="center">A2.1</div></td>
    <td><div align="center">A2.5</div></td>
    <td><div align="center">A3.1</div></td>
    <td><div align="center">A3.5</div></td>
    <td><div align="center">A4.1</div></td>
    <td><div align="center">A4.5</div></td>
    <td><div align="center">A5.1</div></td>
    <td><div align="center">A5.5</div></td>
    <td><div align="center">A6.1</div></td>
    <td><div align="center">A6.5</div></td>
    <td><div align="center">A7.1</div></td>
    <td><div align="center">A7.5</div></td>
    <td><div align="center">A8.1</div></td>
    <td><div align="center">A8.5</div></td>
    <td><div align="center">A9.1</div></td>
    <td><div align="center">A9.5</div></td>
  </tr>
</table>
</div>

<div   class="popup_window_css" id="sample"/>
<table class="popup_window_css"/>
<tr    class="popup_window_css"/>
<td    class="popup_window_css"/>
<div   class="popup_window_css_head"><img src="images/close.gif" alt="" width="9" height="9" />Aksi</div>
<div   class="popup_window_css_body"/><div style="border: 1px solid #808080; padding: 6px; background: #FFFFFF;"/>
<form method="post" action="aksi.php"/>
<table>
    <tr>
     <td> Werehouse Product </td>
     <td><select name="wp">
        <option selected>- Jenis Werehouse -</option>
        <?php
        $q = mssql_query("select WHSName from tblSPDMstWarehouseProduct Order by WHSID"); 

        while ($r = mssql_fetch_array($q)){
        echo "<option value=$r[WHSName]>$r[WHSName]</option>";
        }
        ?>
</select>
</td>
    <tr>
     <td> Posisi</td>
     <td> <input type='text' name='posisi' id='posisi' readonly/></td>
    </tr>
    <tr>
     <td> Product ID</td>
     <td> <select name="pid" id="pid">
        <option selected = "selected" >- Produk ID -</option>
            <?php
            $q = mssql_query("select ProductID from tblMstProduct Order by ProductID"); 

            while ($r = mssql_fetch_array($q)){
            echo "<option value=$r[ProductID]>$r[ProductID]</option>";
        }?>
        </select>
     </td>
    </tr>
    <tr>
     <td> Product Name</td>
     <td ><input type="text" id="pname" name="pname" size="65" readonly/>
     </td>
    </tr>
    <tr>
     <td> Production Date</td>
     <td > <input type='text' name="tgl" /></td>
    </tr>
    <tr>
        <td colspan='2' align='center'>
         <input type='submit' value= 'Save'> 
         <input type='button' value='view' onclick="javascript:ajax_post();"/>
         </td>
    </tr>
</table>
</from>
<div class="popup_window_css_foot">
</div>
</body>
</html>

and then i use jquery selector to get that value and use ajax to execute that value like this

 var htmlobjek;
     $(document).ready(function () {
         var i = $("td").find("td.data").val();
          $.ajax({
                 url: "cek.php",
                 data: "i",
                 cache: false,
                 success: function (data) {
                     $("#cek").val(data);
                 }
             });     
     });

in cek.php of course like this

<?php
$posisi =  $_POST[i];

$val = mssql_num_rows(mssql_query("SELECT*FROM tblTrnProduct WHERE Posisi = '$posisi'"));

echo"$val";
?>

according to the answer before, yes it work. but in single table. i have checked my html structure(it's okay). after i modified into complex table same case happen again.

@PeeHaa埽 You could do this, it is however not recommended. Instead he should use `data-value=""` .. But this is only valid in HTML5 — Brainfeeder, Apr 09 '13 at 07:35
why dont you get the value like this .. $(".data").attr("value").. — Dinesh, Apr 09 '13 at 07:39
@AndriansyahAndri If you `alert` the `i` before the ajax call. What do you get as the value? — Brainfeeder, Apr 09 '13 at 08:20
@AndriansyahAndri I updated your [jsFiddle](http://jsfiddle.net/6qxQW/117/) It didn't work without the `table`and `tr` tags. In your full code make sure you close the `tr`tag where the `.data` is. — Brainfeeder, Apr 09 '13 at 09:51
@Brainfeeder sory, for the first time i think when it work in single table it's wil work in many table too. BUt after i implement it many table same case happen again... — Andriansyah, Apr 10 '13 at 03:05
I notice some other thing in the updated code above. You load jquery 3 times. jquery.min.js is enough. But you will have to place it before you load the pop-up javaScript. — Brainfeeder, Apr 10 '13 at 07:11

RavatSinh Sisodiya · Answer 1 · 2013-04-09T07:50:40.223

try this, hope it will usefull

 var j = $("td").find("td.data").val(); //make sure this will returning value 
 $.ajax({
      url: "cek.php",
      type:"POST",
      data: { i: j },  //Or try { i: $("td").find("td.data").val()},  
      cache: false,
      success: function (data) {
          $("#cek").val(data);
      }
 });

In php

$posisi =  $_POST['i'];

example form jQuery website

  $.post("test.php", { name: "John", time: "2pm" })
    .done(function(data) {
      alert("Data Loaded: " + data);
    });

Brainfeeder · Accepted Answer · 2013-04-10T07:08:26.917

1

After your <td class="data"> you forgot the </tr> .

$(document).ready(function(){

    function setvalue(values) {
        $('#posisi').val(values);
    }

    var htmlobjek;
    //apabila terjadi event onchange terhadap object <select id=pid>
    $("#pid").change(function(){
        var pid = $("#pid").val();
        $.ajax({
            url: "ambilnamaproduk.php",
            data: "pid="+pid,
            cache: false,
            success: function(data){
                $("#pname").val(data);
            }
        });
    });

    var i = $("tr").find("td.data").attr('value');
    $.ajax({
         url: "cek.php",
         type:'POST'
         data: {"data": i},
         cache: false,
         success: 
         function (data) {
             $("#cek").val(data);
         }
    });

    var k = $("#cek").val();
    if(k = "0"){
        $(".data").css("background-color", "#00CC00");//green
    }
    else {
        $(".data").css("background-color", "#FF0000");//red
    }

});

In cek.php your 'i' should be available as $_POST['data'].

FYI: If you have multiple rows with a value, or multiple tables with a value in the rows of those tables you should write the code different. Please see this jsFiddle.

However if there are a lot of values, there will be a lot of ajax calls. A better solution would be to add the value to a hidden input. Please see this jsFiddle.

Hope it helped you out.

edited Apr 10 '13 at 07:08

answered Apr 09 '13 at 09:32

Brainfeeder

2,604
2
19
37

Do in single row? or single table ? You probably should put the ajax in a for each loop if you need each td value on the page. – Brainfeeder Apr 10 '13 at 06:39
Check the 2 jsFiddle links I added to my answer. I explain how to check multiple rows/tables .. As long as the `td` has the `data` `class` it will look for a value in them. – Brainfeeder Apr 11 '13 at 06:51
ih ave implement your advice, but i got a problem in cek.php you said in jsFidlle like this $_POST['value'][0]; // A1.4 $_POST['value'][1]; // A1.5 but it's not work, what you suggest? – Andriansyah Apr 11 '13 at 08:43
In your php do `print_r($_POST);` to see what you get. Don't forget to put everything in a `form` with an `id` if you went for the hidden field solution. – Brainfeeder Apr 11 '13 at 08:57
i have a problem to manage event, how to record the output in after this process have been finish var htmlobjek; $(document).ready(function () { var i = $("td").find("td.data").val(); $.ajax({ url: "cek.php", data: "i", cache: false, success: function (data) { $("#cek").val(data); } }); }); after i loaded in my browser input cek have a value 0 always. c'z this code run before ajax finish.. – Andriansyah Apr 12 '13 at 03:16
[check this](http://stackoverflow.com/questions/555315/jquery-checking-success-of-ajax-post), and [this](http://api.jquery.com/jQuery.ajax/), and [this](http://stackoverflow.com/questions/10931836/should-i-use-done-and-fail-for-new-jquery-ajax-code-instead-of-success-and) – Brainfeeder Apr 12 '13 at 07:04
mean my ajax-jquery succes i got the data that i want, the problem how to manage my script"$(#Cek).val()" run after my ajax.jquery finished. c'z in my page all script run in same time – Andriansyah Apr 12 '13 at 07:20
put `var k = $("#cek").val();` in the succes callback. But it is deprecated. you should use `.done` .. I created a [jsFiddle](http://jsfiddle.net/hKSqX/) again. But i think you should do more of an effort to try and learn yourself. Start reading the jQuery docs and don't just copy everything. – Brainfeeder Apr 12 '13 at 08:13
yes tq i got it... now i wil modified that with many row in one table – Andriansyah Apr 12 '13 at 09:24
i try to improve this web to handle click event. But i have another problem. in this question. i have tried the step you advise me before. when i use alert still nothing happen http://stackoverflow.com/questions/16007858/why-this-script-cannt-work – Andriansyah Apr 15 '13 at 07:05

score 0 · Answer 3 · answered Apr 09 '13 at 07:32

0

firstly try to fix this:

var i = $("td").find("td.data").val();
...
data: "i",

to

var i = $("td").find(".data").attr('value');
...
data: "i="+i,

answered Apr 09 '13 at 07:32

Anton

1,029
7
19

@AndriansyahAndri And if you try `var i = $("tr").find("td.data").attr('value');` – Brainfeeder Apr 09 '13 at 08:18
@Brainfeeder nothing change...:( – Andriansyah Apr 09 '13 at 08:33
debug then, step by step :) write alert(i); after variable set, and see what you got, then go to next row.. – Anton Apr 09 '13 at 08:40

Suresh Kamrushi · Answer 4 · 2013-04-09T07:57:03.453

0

just try this=

$.ajax({
                 url: "cek.php",
                 data: { "data": i},
                 cache: false,
                 success: function (data) {
                     $("#cek").val(data);
                 }
             });

ANd in php you can do like below:

$data = $_POST['data']; //you will get your value

edited Apr 09 '13 at 07:57

answered Apr 09 '13 at 07:32

Suresh Kamrushi

15,627
13
75
90

@AndriansyahAndri: first it should work, if not just try to put it like " data: { "data": i}," also updated my post. – Suresh Kamrushi Apr 09 '13 at 07:57
@AndriansyahAndri Did you link to the jquery.js file? – Brainfeeder Apr 09 '13 at 08:15
@SureshKamrushi use 2 ajax query will influence this problem? c'z before this script i use another ajax for my related combobox check my all code here https://www.dropbox.com/s/jnmc9ps5nvxea2b/code.php – Andriansyah Apr 09 '13 at 08:21

score 0 · Answer 5 · answered Apr 09 '13 at 07:37

There are two main problem with your javascript function 1) Your variable

data: "i",

should be

data: i,

2) Secondly you did not mentioned type of ajax method wether it is GET or POST, in AJAX by default type will be GET if you don't mention it. Hence in your case you are passing type is GET and trying to access variable as POST. So Add this line to your AJAX call

type:'POST',

why my script doesn't get value that I purpose

5 Answers5

Linked