Develop Reference

Pulling data from SQLite, but data is undefined

I have a class project where I need to pull data from my SQLite DB and place it into <table>.
But every time I reload the page I get this Table image and I was hoping for some help. I'm new to JavaScript and I need to finish this task in a few hours, I've tried to pull the data into an object and from the object into this line str += "<td>" + results.rows.item(i).Firstname + "</td>" and still it didn't work.
db.transaction(function (tx) {
tx.executeSql('SELECT * FROM Customers_Table ', [], function (tx, results) {
var len = results.rows.length, i;
document.getElementById("tablea").innerHTML = '';
var str = '';
str += "<th>FirstName</th>";
str += "<th>LastName</th>";
str += "<th>Address</th>";
str += "<th>City</th>";
str += "<th>Email</th>";
for (i = 0; i < len; i++) {
str += "<tr>";
str += "<td>" + results.rows.item(i).Firstname + "</td>";
str += "<td>" + results.rows.item(i).Lastname + "</td>";
str += "<td>" + results.rows.item(i).Address + "</td>";
str += "<td>" + results.rows.item(i).City + "</td>";
str += "<td>" + results.rows.item(i).Email + "</td>";
str += "</tr>";
document.getElementById("tablea").innerHTML += str;
str = '';
}
});
});

Well, considering that you have data in results. It should be used as:
results.rows.item[i].Firstname
NOT
results.rows.item(i).Firstname

Finally figured out the problem, the .Firstname and the rest didn't match the column names from the Db table, it was lowercase,look carefully at your code guys!!

How do I add different classes to <td> in Javascript

Hey I have two td elements in a table.
I want the have separate style classes for them. How do I do this?
This is my code:
table += "<tr>";
for(var i = 0; i < data.list.length; i++){
table += "<td>" + "<table>" + "<td>" + value1 "</td>" + "<td>" + value2 + "</td>" + "</table>";
}
table += "</tr>";
I have tried to simply add class in td element but that does not work.
Any ideas? I use Javascript to create the table.
So this does not work:
table += "<tr>";
for(var i = 0; i < data.list.length; i++){
table += "<td>" + "<table>" + "<td class="one">" + value1 "</td>" + "<td class="two">" + value2 + "</td>" + "</table>";
}
table += "</tr>";

You should be using single quotes inside double-quoted strings, like this
table += "<tr>";
for(var i = 0; i < data.list.length; i++){
table += "<td>" + "<table>" + "<td class='one'>" + value1 "</td>" + "<td class='two'>" + value2 + "</td>" + "</table>";
}
table += "</tr>";

jquery remove everything after space

I am trying to remove everything in my string after space like so:
value.baseOrSchedStartList[i].substring(0, value.baseOrSchedStartList[i].indexOf(' '))
But I get this error:
Uncaught TypeError: Cannot read property 'substring' of undefined
What am I doing wrong ? This is inside an ajax call...here is the full ajax call:
$.ajax({
type: "GET",
url: "/vendorProject/api/connection/getVendorItems?community=" + $("#communtiyDropdown").val(),
dataType: 'json',
cache: false,
success: function (results) {
var html;
html = "<table border='1'>";
html += "<tr>";
html += "<th>Task</th>";
$.each(results, function (key, value) {
html += "<th>" + key + "</th>";
});
html += "<th></th>";
html += "</tr>";
for (i = 0; i < taskArray.length; i++) {
html += "<tr>"
html += "<td>" + taskArray[i] + "</td>";
$.each(results, function (key, value) {
html += "<td>" + value.baseOrSchedStartList[i].substring(0, value.baseOrSchedStartList[i].indexOf(' ')) + "</td>";
});
html += "<td><input type='checkbox' name='checkbox' id='checkbox' /></td>"
html += "</tr>";
}
html += "</table>";
$("#tableData").html(html);
}
});
The string in question is 12-12-2015 08:00:00 AM and I looking for 12-12-2015....no time.

Try to substr :)
$("button").on("click",function(){
var a = $("input").val();
var cropped = a;
if(a.indexOf(" ")>=0) cropped = a.substr(0,a.indexOf(" "));
$("b").html(cropped);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='text' placeholder='write something here and hit the button' style='width:60%;'>
<br>
<button>Ready!</button>
<br>
<div>
The result without space and after all : <b></b>
</div>

Assigning ViewBag property in javascript

I am trying to assign a JS variable to a ViewBag property and use that property in an Html ActionLink.
However, I'm getting a design time compile error: "Syntax error" right below the getJSON method as #ViewBag.CustomerID = data.CustomerID;
Can someone help me out with how this is done?
Here is my code:
#Html.ActionLink("Click to edit Customer", "EditCust", "Customer", new { ViewBag.CustomerID }, null);
<script type="text/javascript">
$(function ()
{
var selID = null
$("#Name").change(function ()
{
selID = $("#Name option:selected").val();
var url = '/Project/SpecificCustomer';
var param = { Id: selID };
$.getJSON(url, param, function (data)
{
#ViewBag.CustomerID = data.CustomerID;
var html = "<table border='1' cellpadding='3'>";
html += "<tr>";
html += "<td>" + "Customer ID: " + data.CustomerID + "</td>";
html += "</tr>";
html += "<tr>";
html += "<td>" + "Email: " + data.Email + "</td>";
html += "</tr>";
html += "<tr>";
var FirstName = data.FirstName;
FirstName == null ? "" : FirstName;
var LastName = data.LastName;
LastName == null ? "" : LastName;
html += "<td>" + "Name: " + FirstName + " " + LastName + "</td>";
html += "</tr>";
html += "<tr>";
var date1 = new Date(parseInt(data.CreatedDate.substr(6)));
date1 == null ? "" : date1;
html += "<td>" + "Created: " + date1 + "</td>";
html += "</tr>";
html += "<tr>";
var date2 = new Date(parseInt(data.UpdatedDate.substr(6)));
date2 == null ? "" : date2;
html += "<td>" + "Updated: " + date2 + "</td>";
html += "</tr>";
html += "</table>";
$("#divData").html('');
$("#divData").append(html);
});
});
});
</script>

This won't work. ViewBag works on server side and it will be out of scope when you get the response of an AJAX request. You should use JavaScript to update the values in your view once you get the response.
You also get the error because an assignment should be in a code block:
#{ ViewBag.CustomerID = data.CustomerID; }
However this still won't work because data is a JavaScript variable.

How to append a value with button's ID in runtime?

I am using below javaScript code to create table in runtime. And i somewhat assumed to append a value into the ID of the button. Will it work. I am confused because of double quotes.
function createTable(){
EmployeeManagement.getList(function(data){
var employee = data;
var x = "<table border= 1 >";
x+="<thead> " + "<tr>" + "<td>" + "Check" + "</td><td>" + "ID" + "</td><td>" + "Name" + "</td><td>" + "Age" + "</td><td>" + "Dept" + "</td><td>" + "Option" + "</td></tr></thead>";
for(i = 0; i<data.length; i++)
{
var id = data[i].id;
x+= "<tr>";
x+= "<td>" + "<input type=checkbox name=Employee value='emp'+id />"
x+= "<td>" + data[i].id + "</td><td>" + data[i].name + "</td>";
x+= "<td>" + data[i].age + "</td><td>" + data[i].dept + "</td>";
x+= "<td>" + "<input id='edit'+id type='button' value='Edit' onclick=edit(this.id) />" + "</td>";
x+= "</tr>";
}
x+= "</table>";
$('#tableHolder').html(x);
});
}
here, i want to append the id value, to the ID value id BUTTON.
I already coded for it. Will it work or how to make it work.
I can use jquery means, how???
Any suggestions would be appreciative...
Thanks

No it won't work. Just do it the same as with the other strings, use string concatenation:
"<input id='edit" + id + "' type='button' value='Edit' onclick=edit(this.id) />"
// --^ --^
Currently, you are generating invalid HTML. But you could have tried yourself to find this out ;)

Yes, this should work. Assuming the id is FOO, the html to generate is:
<input id='editFOO' type='button' ...
which can be done by splitting it up into three parts like so:
"<input id='edit" + id + "' type='button' ..."

Use string concatenation... Also your cells in subsequent rows should match the number of cells in your head row.
function createTable(){
EmployeeManagement.getList(function(data){
var employee = data;
var x = "<table border= 1 >";
x+="<thead> " + "<tr>" + "<td>" + "Check" + "</td><td>" + "Name" + "</td><td>" + "Dept" + "</td><td>" + "Option" + "</td></tr></thead>";
for(i = 0; i<data.length; i++)
{
var id = data[i].id;
x+= "<tr>";
x+= "<td>" + "<input type=checkbox name=Employee value='emp"+id+"' /> </td>";
x+= "<td>" + data[i].id + "</td><td>" + data[i].name + "</td>";
x+= "<td>" + data[i].age + "</td><td>" + data[i].dept + "</td>";
x+= "<td>" + "<input id='edit"+id+"' type='button' value='Edit' onclick=edit(this.id) />" + "</td>";
x+= "</tr>";
}
x+= "</table>";
$('#tableHolder').html(x);
});
}

In JavaScript vars inside a double quoted string are not interpreted. So you have to put the vars outside of the string. Replace e.g. this:
"<input type=checkbox name=Employee value='emp'+id />"
with this:
"<input type=checkbox name=Employee value='emp" + id "' />"