Create button inside table and change while onclick event

Question

I have a problem creating a button on the fly within its function. I've created a table perfectly in php but I don't know how to create a button inside php code using a function on each button.

Example 
ID              NAME            PRICE               ADD
1               STRAW            100                BUTTON 1
2               STRAWRE          300                BUTTON 2
3               STRAWTO          200                BUTTON 3

The button add is dynamically using looping inside the html table. and when I process a click on the button, then the id, name, and price item will be changed with the textbox and each textbox has an auto value using the old one, and button 1 will be added one button left button 1, or button 2, or button 3.

function cetakdata()
{
    if(is_array($_SESSION['pembelian']))
    {
    $total = "";
    echo "Here's your chart" . "<br>";
    $max = count($_SESSION['pembelian']);  
    $th1 = "<th>" . "No" . "</th>";
    $th2 = "<th>" . "Nama Barang" . "</th>";
    $th3 = "<th>" . "Harga Barang" . "</th>";
    $th4 = "<th>" . "Jumlah" . "</th>";
    $th5 = "<th>" . "Subtotal" . "</th>";
    $th6 = "<th>" . "Add Edit" . "</th>";
    echo "<table border=1>";
    echo "<tr>";
    echo $th1 ;
    echo $th2;
    echo $th3;
    echo $th4;
    echo $th5;
    echo $th6;

    echo "</tr>";
    for ($indexo = 0; $indexo < $max; $indexo++) {
   echo "<tr>";
   echo "<td>" . $indexo."</td>";
   echo "<td>" . $_SESSION['pembelian'][$indexo]['namabarang']."</td>";
   echo "<td>" . $_SESSION['pembelian'][$indexo]['hargabarang']."</td>";
   echo "<td>" . $_SESSION['pembelian'][$indexo]['jumlahbarang']."</td>";
   echo "<td>" . $_SESSION['pembelian'][$indexo]['subtotal']."</td>";
   echo "<td>" .THIS IS HOW I PUT THE BUTTON ON THE FLY DELETE BUTTON."</td>";
    $total += $_SESSION['pembelian'][$indexo]['subtotal'];
   echo "</tr>";
    }
    echo "TOTAL BELANJA = ". $total;
    echo "</table>";
    }else
    {
        echo "Chart is still Empty";
    }
}

This is the code. When the button created I the other td will be changing into textbox with its value and after user finished edit user can also save it within the save button beside the add button but the save button will be appeared when user click on edit button like the image above :

enter image description here

Some of what you're describing sounds like it needs to be done in javascript and not php. Client-side vs server-side. — jcmitch
– jcmitch, Commented Dec 13, 2011 at 18:08
Any answers will be so much appreciated please :) But I should connect the button within php code because it will be handled the session — user1088172
– user1088172, Commented Dec 13, 2011 at 18:10
Can you include some of you're php code so we can see what you already have? — jcmitch
– jcmitch, Commented Dec 13, 2011 at 18:20
I think you need to post some code or clean up the question. You already have a button, what do you want to do with it when you click it? — Robert
– Robert, Commented Dec 13, 2011 at 18:24
Thanks a lot but how do I connect this function using a php example like this sample imageshack.us/photo/my-images/831/exampleog.png — user1088172
– user1088172, Commented Dec 13, 2011 at 18:35

Khairu Aqsara · Accepted Answer · 2011-12-13 19:10:49Z

2

just add like a normal button in the last td

<button id="1" name="button">BUTTON 1</button>

and for action do with some jquery function

$(function(){
    $('button[name=button]').click(function(){
        var id= $(this).attr("id");
        //some action here
        //ex:
        window.location.href="ex.php?id="+id;
        //or an ajax fungtion
    });
});

oh... may be you can do with this

<script>
$(function(){
    $('button[name=button]').click(function(){
        var id= $(this).attr("id");
        //some action here
        //ex:
        window.location.href="ex.php?id="+id;
        //or an ajax fungtion
    });
});
</script>
<?php
$query = mysql_query("select * from barang");
echo '<table><tr><th>Nama Barang</th><th>Harga Barang</th><th>Stok</th><th>Action</th></tr>';
while($data = mysql_fetch_array($query)){
    echo "<tr>
        <td>".$data['nama_barang']."</td>
        <td>".$data['harga_barang']."</td>
        <td>".$data['stok_barang']."</td>
        <td><button id=".$data['kode_barang']." name=\"button\">Edit</button></td>
    </tr>";
}
echo '<table>';
?>

EDITED

changes this <td><button id=".$data['kode_barang']." name=\"button\">Edit</button></td>

to

<td><button id=".$data['kode_barang']." name=\"button\" style=\"display:none\">Edit</button><button id=".$data['kode_barang']." name="..$data['kode_barang'].">Edit2</button></td>

and on the javascript just add modify just like this

$(function(){
    $('button[name=button]').click(function(){
        var id= $(this).attr("id");
        $("button[name="+id+"]").show();
        //some action here
        //ex:
        window.location.href="ex.php?id="+id;
        //or an ajax fungtion
    });
});

edited Dec 13, 2011 at 19:10

answered Dec 13, 2011 at 18:32

Khairu Aqsara

1,3103 gold badges14 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

user1088172 Over a year ago

Thanks a lot but how do I connect this function using a php example like this sample imageshack.us/photo/my-images/831/exampleog.png

Khairu Aqsara Over a year ago

what do you mean by connecting function using php ? i don't get it your question?, some case studies or example it'll be good :)

user1088172 Over a year ago

echo "<td><button id=". $_SESSION['pembelian'][$indexo]['namabarang'] . "name="button">Edit</button></td>"; what kind of error is it?

Khairu Aqsara Over a year ago

oo i'm sorry just add the slash on the name=\"button\", see if that work ?

user1088172 Over a year ago

Great Code! I want to vote you but unfortunately that it requires 15 reputation but that code was working well, but my question is how I can add another button beside the edit button when the edit button clicked. Do you have solution?

|

jcmitch · Accepted Answer · 2011-12-13 18:16:32Z

0

Here is an example of creating a button on the fly with javascript.

var buttonnode = document.createElement('input');
buttonnode.setAttribute('type','button');
buttonnode.setAttribute('id','ActionButton');
buttonnode.setAttribute('value','DoAction');
buttonnode.onclick = function(){javascriptFunct();};

I'm a little confused about what you're question is asking but maybe this will help a little. You could set your javascript function to then redirect to a php file on your server.

answered Dec 13, 2011 at 18:16

jcmitch

2,2169 gold badges28 silver badges34 bronze badges

2 Comments

user1088172 Over a year ago

Thanks a lot but how do I connect this function using a php example like this sample imageshack.us/photo/my-images/831/exampleog.png

jcmitch Over a year ago

That "example" is just an image of the table. I think there might be some confusion on what is client-side and what is server-side. You can have html and javascript in your php file. When the user access your code the php will run on the server and then the browser will launch the result. Javascript can then be used for further calculations and we can even at some point redirect to another php file on a server. Things such as buttons are client-side elements and can't access php functions. In javascript we can get values stored in php variables but that is about it.

Collectives™ on Stack Overflow

Create button inside table and change while onclick event

2 Answers 2

6 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related