在新窗口中显示表值
EDIT: Ok I found why it was not working. Jquery was ok but instead of value I took text, so instead .val just .text
So I have a little problem here.
I have a task to export outlook contact file and import it to a database, then display it in html table.
So I did that already and it was not that hard, but here is the next task:
I have my table, with a lot of rows and cells. My first cell is "First Name". When the user clicks on any of the "First Name" to open new window and create input textarea with the value of that cell.
So for example when I click on the name "Georgi" new window should popup with new textarea with the name "Georgi". When I click on "Tomas" new window should popup with new textarea with the name "Tomas". So this textarea should be universal for all names.
I mean I did it for only one name, but do not know how to do it for all names.
I hope you understood me what I want. Here is a picture of the table:
code:
<table id = "firstname" border="2" cellpadding="1" cellspacing="1" width="10000" >
<tr>
<th>First Name</th>
<th>Middle Name</th>
<th>Last Name</th>
<th>Suffix</th>
<th>Company</th>
<th>Department</th>
<th>Job Title</th>
<th>Business Street</th>
<th>Business Street 2</th>
<th>Business Street 3</th>
<th>Business City</th>
<th>Business State</th>
<th>Business Postal Code</th>
<th>Business Country/Region</th>
<th>Home Street</th>
<th>Home Street 2</th>
<th>Home Street 3</th>
<th>Home City</th>
<th>Home State</th>
<th>Home Postal Code</th>
<th>Home Country Region</th>
<th>Other Street</th>
<th>Other Street 2</th>
<th>Other Street 3</th>
<th>Other City</th>
<th>Other State</th>
<th>Other Postal Code</th>
<th>Other Country/Region</th>
<th>Assistant's Phone</th>
<th>Business Fax</th>
<th>Business Phone</th>
<th>Business Phone 2</th>
<th>Callback</th>
<th>Car Phone</th>
<th>Company Main Phone</th>
<th>Home Fax</th>
<th>Home Phone</th>
<th>Home Phone 2</th>
<th>ISDN</th>
<th>Mobile Phone</th>
<th>Other Fax</th>
<th>Other Phone</th>
<th>Pager</th>
<th>Primary Phone</th>
<th>Radio Phone</th>
<th>TTY/TDD PHone</th>
<th>Telex</th>
<th>Account</th>
<th>Anniversary</th>
<th>Assistant's Name</th>
<th>Billing Information</th>
<th>Birthday</th>
<th>Business Address PO Box</th>
<th>Categories</th>
<th>Children</th>
<th>Directory Server</th>
<th>Email Address</th>
<th>Email Type</th>
<th>Email Display Name</th>
<th>Email Address 2</th>
<th>Email Type 2</th>
<th>Email Display Name 2</th>
<th>Email Address 3</th>
<th>Email Type 3</th>
<th>Email Display Name 3</th>
<th>Gender</th>
<th>Government ID Number</th>
<th>Hobby</th>
<th>Home Address PO Box</th>
<th>Initials</th>
<th>Internet Free/Busy</th>
<th>Keywords</th>
<th>Language</th>
<th>Location</th>
<th>Manager's Name</th>
<th>Mileage</th>
<th>Notes</th>
<th>Office Location</th>
<th>Organizational ID Number</th>
<th>Other Address PO Box</th>
<th>Priority</th>
<th>Private</th>
<th>Profession</th>
<th>Referred By</th>
<th>Sensitivity</th>
</tr>
<tr class='table_row'>
<?php
mysqli_select_db($con,'outlook');
$sql = "SELECT * FROM contacts";
$myData = mysqli_query($con,$sql);
while($record = mysqli_fetch_array($myData))
{
echo "<tr>";
echo "<td id=\"fname\">" . "<a class='why' href='#' onClick='myFunction()'>" . $record['first_name'] . "</a>" . "</td>";
echo '<script type="text/javascript">';
echo 'function myFunction(){';
echo 'var myWindow = window.open("", "", "width=1024, height=555, left=450, top=100");';
echo 'myWindow.document.write(';
echo '"';
echo '<html>';
echo '<head>';
echo '<script src=\"http://code.jquery.com/jquery-1.9.1.js\"><\/script>';
echo '<script type=\"text/javascript\">';
echo '<\/script>';
echo '</head>';
echo '<body>';
echo '<div id=\"showcase\" style=\"background-color: #F5FFE0; margin-right: 25%; margin-left: 30%; padding-left:3%; padding-right:2%; border:solid 5px #242222;\">';
echo '<p style=\"background-color:#7A993D;\">Personal</p>';
echo '<select>';
echo '<option selected >Full Name</option>';
echo '</select>';
echo '<input type=\"text\" value=\"'.($record['first_name']).'\" style=\"margin-left: 25.3%;\"><br>';
echo '<select>';
echo '<option selected>Company</option>';
echo '</select>';
echo '<input type=\"text\" value=\"'.($record['company']).'\" style=\"margin-left: 26.3%;\"><br>';
echo '<select>';
echo '<option selected>Job Title</option>';
echo '</select>';
echo '<input type=\"text\" value=\"'.($record['job_title']).'\" style=\"margin-left: 28%;\"><br><br>';
echo '<p style=\"background-color:#7A993D;\">Internet</p>';
echo '<select>';
echo '<option>E-Mail</option>';
echo '<option>E-Mail 2</option>';
echo '<option>E-Mail 3</option>';
echo '</select>';
echo '<input type=\"text\" value=\"'.($record['email_address']).'\" style=\"margin-left: 28%;\"><br>';
echo '<select>';
echo '<option selected>Web page address</option>';
echo '</select>';
echo '<input type=\"text\" value=\"'.($record['internet_free_busy']).'\" style=\"margin-left: 12.5%;\"><br>';
echo '<p style=\"background-color:#7A993D;\">Phone numbers</p>';
echo '<select>';
echo '<option>Assistant</option>';
echo '<option selected>Business</option>';
echo '<option>Business 2</option>';
echo '<option>Business Fax</option>';
echo '<option>Callback</option>';
echo '<option>Car</option>';
echo '<option>Company</option>';
echo '<option>Home</option>';
echo '<option>Home 2</option>';
echo '<option>Home Fax</option>';
echo '<option>ISDN</option>';
echo '<option>Mobile</option>';
echo '<option>Other</option>';
echo '<option>Other Fax</option>';
echo '<option>Pager</option>';
echo '<option>Primary</option>';
echo '<option>Radio</option>';
echo '<option>Telex</option>';
echo '<option>TTY/TDD</option>';
echo '</select>';
echo '<script>';
echo 'var myColor = document.getElementById(\"fname\").value;';
echo '<\/script>';
echo '<input type=\"text\" value=myColor style=\"margin-left: 20%;\"><br>';
echo '<select>';
echo '<option>Assistant</option>';
echo '<option selected>Business</option>';
echo '<option>Business 2</option>';
echo '<option>Business Fax</option>';
echo '<option>Callback</option>';
echo '<option>Car</option>';
echo '<option>Company</option>';
echo '<option>Home</option>';
echo '<option>Home 2</option>';
echo '<option>Home Fax</option>';
echo '<option>ISDN</option>';
echo '<option>Mobile</option>';
echo '<option>Other</option>';
echo '<option>Other Fax</option>';
echo '<option>Pager</option>';
echo '<option>Primary</option>';
echo '<option>Radio</option>';
echo '<option>Telex</option>';
echo '<option>TTY/TDD</option>';
echo '</select>';
echo '<input type=\"text\" value=\"'.($record['business_phone']).'\" style=\"margin-left: 20%;\"><br>';
echo '<select>';
echo '<option>Assistant</option>';
echo '<option>Business</option>';
echo '<option>Business 2</option>';
echo '<option selected>Business Fax</option>';
echo '<option>Callback</option>';
echo '<option>Car</option>';
echo '<option>Company</option>';
echo '<option>Home</option>';
echo '<option>Home 2</option>';
echo '<option>Home Fax</option>';
echo '<option>ISDN</option>';
echo '<option>Mobile</option>';
echo '<option>Other</option>';
echo '<option>Other Fax</option>';
echo '<option>Pager</option>';
echo '<option>Primary</option>';
echo '<option>Radio</option>';
echo '<option>Telex</option>';
echo '<option>TTY/TDD</option>';
echo '</select>';
echo '<input type=\"text\" value=\"'.($record['business_fax']).'\" style=\"margin-left: 20%;\"><br>';
echo '<select>';
echo '<option>Assistant</option>';
echo '<option>Business</option>';
echo '<option>Business 2</option>';
echo '<option>Business Fax</option>';
echo '<option>Callback</option>';
echo '<option>Car</option>';
echo '<option>Company</option>';
echo '<option>Home</option>';
echo '<option>Home 2</option>';
echo '<option>Home Fax</option>';
echo '<option>ISDN</option>';
echo '<option selected>Mobile</option>';
echo '<option>Other</option>';
echo '<option>Other Fax</option>';
echo '<option>Pager</option>';
echo '<option>Primary</option>';
echo '<option>Radio</option>';
echo '<option>Telex</option>';
echo '<option>TTY/TDD</option>';
echo '</select>';
echo '<input type=\"text\" value=\"'.($record['mobile_phone']).'\" style=\"margin-left: 20%;\"><br>';
echo '<p style=\"background-color:#7A993D;\">Addresses</p>';
echo '<select>';
echo '<option selected>Business</option>';
echo '<option >Home</option>';
echo '<option >Other</option>';
echo '</select>';
echo '<input type=\"text\" value=\"'.($record['business_street']).'\" style=\"margin-left: 26.5%;\"><br><br>';
echo '<\/div>';
echo '</body></html>';
echo '"';
echo ');';
echo '}';
echo '</script>';
echo "<td>" . $record['middle_name'] . "</td>";
echo "<td>" . $record['last_name'] . "</td>";
echo "<td>" . $record['suffix'] . "</td>";
echo "<td>" . $record['company'] . "</td>";
echo "<td>" . $record['department'] . "</td>";
echo "<td>" . $record['job_title'] . "</td>";
echo "<td>" . $record['business_street'] . "</td>";
echo "<td>" . $record['business_street2'] . "</td>";
echo "<td>" . $record['business_street3'] . "</td>";
echo "<td>" . $record['business_city'] . "</td>";
echo "<td>" . $record['business_state'] . "</td>";
echo "<td>" . $record['business_postal_code'] . "</td>";
echo "<td>" . $record['business_country_region'] . "</td>";
echo "<td>" . $record['home_street'] . "</td>";
echo "<td>" . $record['home_street2'] . "</td>";
echo "<td>" . $record['home_street3'] . "</td>";
echo "<td>" . $record['home_city'] . "</td>";
echo "<td>" . $record['home_state'] . "</td>";
echo "<td>" . $record['home_postal_code'] . "</td>";
echo "<td>" . $record['home_country_region'] . "</td>";
echo "<td>" . $record['other_street'] . "</td>";
echo "<td>" . $record['other_street2'] . "</td>";
echo "<td>" . $record['other_street3'] . "</td>";
echo "<td>" . $record['other_city'] . "</td>";
echo "<td>" . $record['other_state'] . "</td>";
echo "<td>" . $record['other_postal_code'] . "</td>";
echo "<td>" . $record['other_country_region'] . "</td>";
echo "<td>" . $record['assistants_phone'] . "</td>";
echo "<td>" . $record['business_fax'] . "</td>";
echo "<td>" . $record['business_phone'] . "</td>";
echo "<td>" . $record['business_phone2'] . "</td>";
echo "<td>" . $record['callback'] . "</td>";
echo "<td>" . $record['car_phone'] . "</td>";
echo "<td>" . $record['company_main_phone'] . "</td>";
echo "<td>" . $record['home_fax'] . "</td>";
echo "<td>" . $record['home_phone'] . "</td>";
echo "<td>" . $record['home_phone2'] . "</td>";
echo "<td>" . $record['isdn'] . "</td>";
echo "<td>" . $record['mobile_phone'] . "</td>";
echo "<td>" . $record['other_fax'] . "</td>";
echo "<td>" . $record['other_phone'] . "</td>";
echo "<td>" . $record['pager'] . "</td>";
echo "<td>" . $record['primary_phone'] . "</td>";
echo "<td>" . $record['radio_phone'] . "</td>";
echo "<td>" . $record['tty_tdd_phone'] . "</td>";
echo "<td>" . $record['telex'] . "</td>";
echo "<td>" . $record['account'] . "</td>";
echo "<td>" . $record['anniversary'] . "</td>";
echo "<td>" . $record['assistants_name'] . "</td>";
echo "<td>" . $record['billing_information'] . "</td>";
echo "<td>" . $record['birthday'] . "</td>";
echo "<td>" . $record['business_address_po_box'] . "</td>";
echo "<td>" . $record['categories'] . "</td>";
echo "<td>" . $record['children'] . "</td>";
echo "<td>" . $record['directory_server'] . "</td>";
echo "<td>" . $record['email_address'] . "</td>";
echo "<td>" . $record['email_type'] . "</td>";
echo "<td>" . $record['email_display_name'] . "</td>";
echo "<td>" . $record['email_address2'] . "</td>";
echo "<td>" . $record['email_type2'] . "</td>";
echo "<td>" . $record['email_display_name2'] . "</td>";
echo "<td>" . $record['email_address3'] . "</td>";
echo "<td>" . $record['email_type3'] . "</td>";
echo "<td>" . $record['email_display_name3'] . "</td>";
echo "<td>" . $record['gender'] . "</td>";
echo "<td>" . $record['government_id_number'] . "</td>";
echo "<td>" . $record['hobby'] . "</td>";
echo "<td>" . $record['home_address_po_box'] . "</td>";
echo "<td>" . $record['initials'] . "</td>";
echo "<td>" . $record['internet_free_busy'] . "</td>";
echo "<td>" . $record['keywords'] . "</td>";
echo "<td>" . $record['language'] . "</td>";
echo "<td>" . $record['location'] . "</td>";
echo "<td>" . $record['managers_name'] . "</td>";
echo "<td>" . $record['mileage'] . "</td>";
echo "<td>" . $record['notes'] . "</td>";
echo "<td>" . $record['office_location'] . "</td>";
echo "<td>" . $record['organizational_id_number'] . "</td>";
echo "<td>" . $record['other_address_po_box'] . "</td>";
echo "<td>" . $record['priority'] . "</td>";
echo "<td>" . $record['private'] . "</td>";
echo "<td>" . $record['profession'] . "</td>";
echo "<td>" . $record['referred_by'] . "</td>";
echo "<td>" . $record['sensitivity'] . "</td>";
}
?>
</tr>
You could add an id to the desired td just like
echo "<td id='helper'>" . $record['middle_name'] . "</td>";
And then use jquery
$('#helper').click(function(){
var x=window.open();
x.document.open();
x.document.write('<textarea>'+$(this).val()+'</textarea>');
x.document.close();
});
Hope it worlks!
You can try this:( the window.open(...); function) link : w3schools the simple call just opens a window with the specified url, but there is also a custom call, that enables you to specify the content
ie:
var myWindow = window.open("", "MsgWindow", "width=200, height=100");
myWindow.document.write("<p>This is 'MsgWindow'. I am 200px wide and 100px tall!</p>");
example taken from the above page. I guess in your situation you just have to replace the <p>..</p> with some generated tags (which if I read correctly you already do)