html code in javascript function

Question

Heads up before reading. I'm totally new in html and so, so please be patient. I have the following html code and two javascript functions.

<HTML>  <HEAD> .....    </HEAD>
    <BODY>
        <CENTER>            
        <form id="keyForm">
            Όνομα/Επώνυμο:&nbsp;&nbsp; <input type="text" name="keyword"><br><br>
            <input type="button" onClick="resetFunction()" value="Επαναφορά"> &nbsp; &nbsp; &nbsp;
            <input type="button" onClick="my_search(this.form.keyword.value)" value="Αναζήτηση">
        </form>
        <p id="results"></p>
    </CENTER>
     <script>
        function resetFunction() {
            document.getElementById("results").innerHTML = "";
            document.getElementById("keyForm").reset();

        }
    </script>
    <script>
        function my_search(kw) {
            document.getElementById("results").innerHTML =  (

                <table border="1" style="width:500px">
                <tr>
                    <td>ID</td>
                    <td>Επίθετο</td>        
                    <td>Όνομα</td>
                    <td>Ημερομηνία π��όσληψης</td>
                    <td>Τμήμα</td>
                </tr>
            </table> );

        }
    </script>
</BODY>
</HTML>

I want the "results" to be be table that is described in function "my_search" extended by the actual results produced by the following php code.

<?php
header("content-type: text/html;charset=utf-8");

$link = mysqli_connect("127.0.0.1","root", "tralalalalala", "mycompany");
if (!$link) {
    printf("Connect failed: %s\n",
    mysqli_connect_error());
    exit();
}
//printf("Host information: %s<br>",
//mysqli_get_host_info($link));

$key = $_POST['keyword'];   //Keyword in initialized in html
//echo $key; echo "<br>";

$stmt = mysqli_prepare($link, "
    select e.emp_id, e.first_name, e.last_name, e.hire_date, d.dept_name
    from employee e, department d
    where e.dept_id = d.dept_id and (e.first_name like ? or e.last_name like ?)");
$likeKey = "%{$key}%";
mysqli_stmt_bind_param($stmt, "ss", $likeKey, $likeKey);
mysqli_stmt_execute($stmt);
mysqli_stmt_bind_result($stmt, $id, $f_name, $l_name, $hire_date, $d_name);

$stmt->store_result();
$rows = $stmt->num_rows; 
if ($rows)
    printf("Βρέθηκαν %d αποτελέσματα<br>", $rows);
else
    printf("Δε βρέθηκαν αποτελέσματα για τη λέξη-κλειδί \"%s\" <br>", $key);

for ($i = 0; $i<$rows; $i++){
    mysqli_stmt_fetch($stmt);
    printf("%d %s %s %s %s <br>", $id, $f_name, $l_name, $hire_date, $d_name);
}
mysqli_stmt_close($stmt);
mysqli_close($link);
?>

In the end I wanna have something like this

results

It's Greek but I think you can handle it ;) Thank you for your replies :)

The only reason I see to do it in JavaScript is because you get the data result via Ajax, but I don't see any Ajax call in your code, so just use PHP and HTML. — Darko Romanov
– Darko Romanov, Commented Jul 16, 2014 at 12:17
So, what is the problem ? What have you done so far, which part gives you trouble ? — d.raev
– d.raev, Commented Jul 16, 2014 at 12:18
You have to do an Ajax call or Post method to accomplish this — Vigneshwaran
– Vigneshwaran, Commented Jul 16, 2014 at 12:19

Gus de Boer · Accepted Answer · 2014-07-16 12:26:47Z

2

You can append a string using +=

var str;

str += '<tr>';
str += '<td>Text</td>';
str += '<tr>';

answered Jul 16, 2014 at 12:26

Gus de Boer

40113 silver badges24 bronze badges

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

Comments

rob · Accepted Answer · 2014-07-16 12:41:03Z

-Do not use <center>, it is deprecated

Here is more information about deprecated attributes http://www.w3.org/TR/html4/index/attributes.html

-You have to use AJAX. Here is some information about AJAX jQuery http://api.jquery.com/jquery.ajax/ and http://jquery.com/

You can try this:

$(function(){

   $("form").submit(function(){


       $.ajax({
           url: "", //put the name of the php file
           type: "post",
           data: { keyword: $(".keyword").val() },
           success: function(response){
              //add the output from the php file to the div in the html file using 
              //append() or html()
            }

       });

   });

}

Collectives™ on Stack Overflow

html code in javascript function

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related