Develop Reference

Get dynamically created table cell value on click of table button

I am creating dynamic table which I has 3 columns. First columns has campaign name 2nd & 3rd column is status of that campaign which is image button. What I expect when I click status button it should return respective campaign name. Nothing happens when I click on status button.
would be great if you can provide solution.
function displayCampaigns(campaignNames) {
var html = "<table class='table table - responsive - md' id='campaignTable'>";
for (var i = 0; i < campaignNames.length; i++) {
html += "<tr>";
html += "<td>" + campaignNames[i] + "</td>";
html += "<td><input type='button' id='telStatus' class='btn btn-success btn-circle btn-sm' onclick=function(){getRow(this)}/></td>";
html += "<td><img src='ready.jpg' id='readyStatus' /></td>";
html += "</tr>";
}
html += "</table>";
document.getElementById("demo").innerHTML = html;
function getRow(obj) {
var txt;
e.preventDefault();
txt = $(this).parent().prev().prev().text();
alert(txt + 'selected txt');
}

i have fixed your problem.
function displayCampaigns(campaignNames) {
var html = "<table class='table table - responsive - md' id='campaignTable'>";
for (var i = 0; i < campaignNames.length; i++) {
html += "<tr>";
html += "<td class='parent'>" + campaignNames[i] + "</td>";
html += "<td><input type='button' id='telStatus' class='btn btn-success btn-circle btn-sm' onclick=getRow(this) /></td>";
html += "<td><img src='ready.jpg' id='readyStatus' /></td>";
html += "</tr>";
}
html += "</table>";
document.getElementById("demo").innerHTML = html;
}
function getRow(event) {
var txt = $(event).parent().prev().text();;
alert(txt + ' selected txt');
}
var a = ["test","test2"];
displayCampaigns(a);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="demo"></div>

You could save the #demo object in a variable and attach an event listener to that. On click check if the event target has a class that you attach to your buttons, like telStatus (don't use that as id because having more than one row will result in several html elements having the same id). Add the campaign name as id or a data attribute to the table rows and just check the clicked buttons parentNodes to retrieve the id/data attribue.
var campaignNames = [
'abc', 'efg'
]
var demo = document.querySelector('#demo');
displayCampaigns(campaignNames);
function displayCampaigns(campaignNames) {
var html = "<table class='table table-responsive-md' id='campaignTable'>";
for (var i = 0; i < campaignNames.length; i++) {
html += "<tr id='" + campaignNames[i] +"'>";
html += "<td>" + campaignNames[i] + "</td>";
html += "<td><input type='button' class='telStatus btn btn-success btn-circle btn-sm'/></td>";
html += "<td><img src='ready.jpg' /></td>";
html += "</tr>";
}
html += "</table>";
demo.innerHTML = html;
}
demo.addEventListener('click', function (evt) {
if (!evt.target.classList.contains('telStatus')) return;
var parentTr = evt.target.parentNode.parentNode;
var campaignName = parentTr.id;
alert(campaignName + ' selected txt');
});

jQuery modify value on specific table cell

I am trying to programmatically modify a cell content.
this is how I am adding rows to my table:
addLine(id) {
var newRow = $('<tr id=' + this.id + '>');
var cols = "";
cols += '<td>' + name + '</td>';
cols += '<td id=s>test</td>';
newRow.append(cols);
$(".table").append(newRow);
this.id++;
}
and this is how I tried to modify the cell on row 0 with id equl to s
//$(".table").find('tr#'+0).find('td:eq(1)').html("some other text");
This is not changin the content of the second td cell and I am not able to figure out why.

Here's a working sample you just need to call .find('#' + id) to find the wanted row
var id = 0;
var name = "abcdef";
function addLine() {
var newRow = $('<tr id=' + id++ + '>');
var cols = "";
cols += '<td>' + name + '</td>';
cols += '<td id=s>test</td>';
newRow.append(cols);
$(".table").append(newRow);
}
function changeValue() {
$(".table").find('#' + 1).find('td:eq(1)').html("some other text");
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<button onclick="addLine()">Add line </button>
<button onclick="changeValue()">Change Value </button>
<table class="table"></table>

The selector for the 2nd td, you should do td:nth-child(2) to select the 2nd one.
Also, a quick note. <table> automatically adds a <tbody> tag under it, so you should really do $('.table tbody').append(newRow).

I fixed some stuff for you:
addLine(id){
var newRow = "<tr id="+id+">";
var cols = "";
cols += '<td>' + name + '</td>';
cols += '<td>test</td>'; // you are always setting the same id. just leave it blank
newRow.append(cols);
newRow = "</tr>"; // tr tag needs to be closed
$(".table").append(newRow);
id++;
}
And the query would be:
$('#'+searchId).children('td').eq(1).html("some other text"); //searchId = id of your row

First of all html ids and classes should not begin with numbers. Using jQuery you can do it without assigning ids to rows and columns.
Also note if your adding Ids make sure all ids are unique.
var id = 1;
function addLine() {
var name = "Row " + id + " column 1";
var newRow = $('<tr>');
var cols = "";
cols += '<td>' + name + '</td>';
cols += '<td>test</td>';
newRow.append(cols);
$(".table").append(newRow);
id++;
}
function changeCell(row, col) {
$(".table").find('tr').eq(--row).find('td').eq(--col).html("some other text");
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<button onclick="addLine()">Add Line</button>
<!-- add two rows to change row 2 col 1 value -->
<button onclick="changeCell(2,1)">Change row 2 col 1</button>
<table class="table"></table>

Grand Total In Shopping Cart using Javascript only

i need a help in my problem. This is just a simple problem but i couldn't get it. All you need to do is to calculate the grand total of the shopping cart below the table. You just need to use javascript only, no jquery is allowed. Hope you guys can answer this simple problem. Thanks guys.
var products = [];
var cart = [];
function addProduct() {
var productID = document.getElementById("productID").value;
var product_desc = document.getElementById("product_desc").value;
var qty = document.getElementById("quantity").value;
var price = document.getElementById("price").value;
var newProduct = {
product_id: null,
product_desc: null,
product_qty: 0,
product_price: 0.00,
};
newProduct.product_id = productID;
newProduct.product_desc = product_desc;
newProduct.product_qty = qty;
newProduct.product_price = price;
products.push(newProduct);
var html = "<table border='1|1' >";
html += "<td>Product ID</td>";
html += "<td>Product Description</td>";
html += "<td>Quantity</td>";
html += "<td>Price</td>";
html += "<td>Action</td>";
for (var i = 0; i < products.length; i++) {
html += "<tr>";
html += "<td>" + products[i].product_id + "</td>";
html += "<td>" + products[i].product_desc + "</td>";
html += "<td>" + products[i].product_qty + "</td>";
html += "<td>" + products[i].product_price + "</td>";
html += "<td><button type='submit' onClick='deleteProduct(\"" + products[i].product_id + "\", this);'/>Delete Item</button> &nbsp <button type='submit' onClick='addCart(\"" + products[i].product_id + "\", this);'/>Add to Cart</button></td>";
html += "</tr>";
}
html += "</table>";
document.getElementById("demo").innerHTML = html;
document.getElementById("resetbtn").click()
}
function deleteProduct(product_id, e) {
e.parentNode.parentNode.parentNode.removeChild(e.parentNode.parentNode);
for (var i = 0; i < products.length; i++) {
if (products[i].product_id == product_id) {
// DO NOT CHANGE THE 1 HERE
products.splice(i, 1);
}
}
}
function addCart(product_id) {
//Indentify the product and add it to new "cart" array
for (var i = 0; i < products.length; i++) {
if (products[i].product_id == product_id) {
var cartItem = null;
for (var k = 0; k < cart.length; k++) {
if (cart[k].product.product_id == products[i].product_id) {//Already exists in cart, increment quantity.
cartItem = cart[k];
cart[k].product_qty++;//Increment by one only, as requested.
break;
}
}
if (cartItem == null) {
//Every item in the cart specifies the product in question as well as how many of the product there is in the cart, starts off at product's quantity
var cartItem = {
product: products[i],
product_qty: products[i].product_qty // Start of at product's quantity
};
cart.push(cartItem);
}
break
}
}
renderCartTable();
}
function renderCartTable() {
var html = '';
var ele = document.getElementById("demo2");
ele.innerHTML = ''; //Start by clearng your table of old elements
html += "<table id='tblCart' border='1|1'>";
html += "<tr><td>Product ID</td>";
html += "<td>Product Description</td>";
html += "<td>Quantity</td>";
html += "<td>Price</td>";
html += "<td>Total</td>";
html += "<td>Action</td></tr>";
for (var i = 0; i < cart.length; i++) {
html += "<tr>";
html += "<td>" + cart[i].product.product_id + "</td>";
html += "<td>" + cart[i].product.product_desc + "</td>";
html += "<td>" + cart[i].product_qty + "</td>";
html += "<td>" + cart[i].product.product_price + "</td>";
html += "<td>" + parseFloat(cart[i].product.product_price) * parseInt(cart[i].product_qty) + "</td>";
html += "<td><button type='submit' onClick='subtractQuantity(\"" + cart[i].product.product_id + "\", this);'/>Subtract Quantity</button> &nbsp<button type='submit' onClick='addQuantity(\"" + cart[i].product.product_id + "\", this);'/>Add Quantity</button></td>";
html += "</tr>";
var GrandTotal = parseFloat(cart[i].product.product_price) * parseInt(cart[i].product_qty);
document.getElementById('demo3').innerHTML = GrandTotal;
}
html += "</table>";
ele.innerHTML = html;
}
function subtractQuantity(product_id)
{
for (var i = 0; i < cart.length; i++) {
if (cart[i].product.product_id == product_id) {
cart[i].product_qty--;//decrement by one
}
if (cart[i].product_qty == 0) {
cart.splice(i,1);//Remove from cart
}
console.log("Products " + JSON.stringify(products));
}
//Finally, re-render the cart table
renderCartTable();
}
function addQuantity(product_id)
{
for (var i = 0; i < cart.length; i++) {
if (cart[i].product.product_id == product_id) {
cart[i].product_qty++;//decrement by one
}
}
//Finally, re-render the cart table
renderCartTable();
}
<!DOCTYPE html>
<html>
<head>
<title>Shopping Cart Pure Javascript</title>
</head>
<body>
<form name="order" id="order">
<table>
<tr>
<td>
<label for="productID">Product ID:</label>
</td>
<td>
<input id="productID" name="product" type="text" size="28" required/>
</td>
</tr>
<tr>
<td>
<label for="product">Product Desc:</label>
</td>
<td>
<input id="product_desc" name="product" type="text" size="28" required/>
</td>
</tr>
<tr>
<td>
<label for="quantity">Quantity:</label>
</td>
<td>
<input id="quantity" name="quantity" width="196px" required/>
</td>
</tr>
<tr>
<td>
<label for="price">Price:</label>
</td>
<td>
<input id="price" name="price" size="28" required/>
</td>
</tr>
</table>
<input type="reset" name="reset" id="resetbtn" class="resetbtn" value="Reset" />
<input type="button" id="btnAddProduct" onclick="addProduct();" value="Add New Product" >
</form>
<br>
<p id="demo"></p> <br/>
<h2> Shopping Cart </h2>
<p id="demo2"></p>
<p id="demo3"></p>
</body>
</html>
var products = [];
var cart = [];
function addProduct() {
var productID = document.getElementById("productID").value;
var product_desc = document.getElementById("product_desc").value;
var qty = document.getElementById("quantity").value;
var price = document.getElementById("price").value;
var newProduct = {
product_id: null,
product_desc: null,
product_qty: 0,
product_price: 0.00,
};
newProduct.product_id = productID;
newProduct.product_desc = product_desc;
newProduct.product_qty = qty;
newProduct.product_price = price;
products.push(newProduct);
var html = "<table border='1|1' >";
html += "<td>Product ID</td>";
html += "<td>Product Description</td>";
html += "<td>Quantity</td>";
html += "<td>Price</td>";
html += "<td>Action</td>";
for (var i = 0; i < products.length; i++) {
html += "<tr>";
html += "<td>" + products[i].product_id + "</td>";
html += "<td>" + products[i].product_desc + "</td>";
html += "<td>" + products[i].product_qty + "</td>";
html += "<td>" + products[i].product_price + "</td>";
html += "<td><button type='submit' onClick='deleteProduct(\"" + products[i].product_id + "\", this);'/>Delete Item</button> &nbsp <button type='submit' onClick='addCart(\"" + products[i].product_id + "\", this);'/>Add to Cart</button></td>";
html += "</tr>";
}
html += "</table>";
document.getElementById("demo").innerHTML = html;
document.getElementById("resetbtn").click()
}
function deleteProduct(product_id, e) {
e.parentNode.parentNode.parentNode.removeChild(e.parentNode.parentNode);
for (var i = 0; i < products.length; i++) {
if (products[i].product_id == product_id) {
// DO NOT CHANGE THE 1 HERE
products.splice(i, 1);
}
}
}
function addCart(product_id) {
//Indentify the product and add it to new "cart" array
for (var i = 0; i < products.length; i++) {
if (products[i].product_id == product_id) {
var cartItem = null;
for (var k = 0; k < cart.length; k++) {
if (cart[k].product.product_id == products[i].product_id) {//Already exists in cart, increment quantity.
cartItem = cart[k];
cart[k].product_qty++;//Increment by one only, as requested.
break;
}
}
if (cartItem == null) {
//Every item in the cart specifies the product in question as well as how many of the product there is in the cart, starts off at product's quantity
var cartItem = {
product: products[i],
product_qty: products[i].product_qty // Start of at product's quantity
};
cart.push(cartItem);
}
break
}
}
renderCartTable();
}
function renderCartTable() {
var html = '';
var ele = document.getElementById("demo2");
ele.innerHTML = ''; //Start by clearng your table of old elements
html += "<table id='tblCart' border='1|1'>";
html += "<tr><td>Product ID</td>";
html += "<td>Product Description</td>";
html += "<td>Quantity</td>";
html += "<td>Price</td>";
html += "<td>Total</td>";
html += "<td>Action</td></tr>";
for (var i = 0; i < cart.length; i++) {
html += "<tr>";
html += "<td>" + cart[i].product.product_id + "</td>";
html += "<td>" + cart[i].product.product_desc + "</td>";
html += "<td>" + cart[i].product_qty + "</td>";
html += "<td>" + cart[i].product.product_price + "</td>";
html += "<td>" + parseFloat(cart[i].product.product_price) * parseInt(cart[i].product_qty) + "</td>";
html += "<td><button type='submit' onClick='subtractQuantity(\"" + cart[i].product.product_id + "\", this);'/>Subtract Quantity</button> &nbsp<button type='submit' onClick='addQuantity(\"" + cart[i].product.product_id + "\", this);'/>Add Quantity</button></td>";
html += "</tr>";
var GrandTotal = parseFloat(cart[i].product.product_price) * parseInt(cart[i].product_qty);
document.getElementById('demo3').innerHTML = GrandTotal;
}
html += "</table>";
ele.innerHTML = html;
}
function subtractQuantity(product_id)
{
for (var i = 0; i < cart.length; i++) {
if (cart[i].product.product_id == product_id) {
cart[i].product_qty--;//decrement by one
}
if (cart[i].product_qty == 0) {
cart.splice(i,1);//Remove from cart
}
console.log("Products " + JSON.stringify(products));
}
//Finally, re-render the cart table
renderCartTable();
}
function addQuantity(product_id)
{
for (var i = 0; i < cart.length; i++) {
if (cart[i].product.product_id == product_id) {
cart[i].product_qty++;//decrement by one
}
}
//Finally, re-render the cart table
renderCartTable();
}
<!DOCTYPE html>
<html>
<head>
<title>Shopping Cart Pure Javascript</title>
</head>
<body>
<form name="order" id="order">
<table>
<tr>
<td>
<label for="productID">Product ID:</label>
</td>
<td>
<input id="productID" name="product" type="text" size="28" required/>
</td>
</tr>
<tr>
<td>
<label for="product">Product Desc:</label>
</td>
<td>
<input id="product_desc" name="product" type="text" size="28" required/>
</td>
</tr>
<tr>
<td>
<label for="quantity">Quantity:</label>
</td>
<td>
<input id="quantity" name="quantity" width="196px" required/>
</td>
</tr>
<tr>
<td>
<label for="price">Price:</label>
</td>
<td>
<input id="price" name="price" size="28" required/>
</td>
</tr>
</table>
<input type="reset" name="reset" id="resetbtn" class="resetbtn" value="Reset" />
<input type="button" id="btnAddProduct" onclick="addProduct();" value="Add New Product" >
</form>
<br>
<p id="demo"></p> <br/>
<h2> Shopping Cart </h2>
<p id="demo2"></p>
<p id="demo3"></p>
</body>
</html>

You only edit renderCartTable function
function removeCart(index) {
cart.splice(index, 1);
renderCartTable();
}
function renderCartTable() {
var html = '';
var ele = document.getElementById("demo2");
ele.innerHTML = ''; //Start by clearng your table of old elements
html += "<table id='tblCart' border='1|1'>";
html += "<tr><td>Product ID</td>";
html += "<td>Product Description</td>";
html += "<td>Quantity</td>";
html += "<td>Price</td>";
html += "<td>Total</td>";
html += "<td>Action</td></tr>";
var GrandTotal = 0;
for (var i = 0; i < cart.length; i++) {
html += "<tr>";
html += "<td>" + cart[i].product.product_id + "</td>";
html += "<td>" + cart[i].product.product_desc + "</td>";
html += "<td>" + cart[i].product_qty + "</td>";
html += "<td>" + cart[i].product.product_price + "</td>";
html += "<td>" + parseFloat(cart[i].product.product_price) * parseInt(cart[i].product_qty) + "</td>";
html += "<td><button type='submit' onClick='subtractQuantity(\"" + cart[i].product.product_id + "\", this);'/>Subtract Quantity</button> &nbsp<button type='submit' onClick='addQuantity(\"" + cart[i].product.product_id + "\", this);'/>Add Quantity</button>&nbsp<button type='submit' onClick='removeCart(\"" + i + "\", this);'/>Remove</button></td>";
html += "</tr>";
GrandTotal += parseFloat(cart[i].product.product_price) * parseInt(cart[i].product_qty);
}
document.getElementById('demo3').innerHTML = GrandTotal;
html += "</table>";
ele.innerHTML = html;
}

Removing & Updating Table Rows Using jQuery

I am a novice when it comes to jQuery so please bear with me a little and I apologies for my poor coding in advance.
The logic to my code is simple or at least that was the aim.
A jQuery script checks a type field and then gets its values and builds a table. That all works 100%.
The issue comes when deleting rows and then updating the table id's on the new appended rows that is generated by clicking on the new row button.
The new rows do not delete.
Here is the code but I have also created a jsfiddle so you can check it out live, but there are some bugs that are not there on the site - for instance you need to double click the button for some reason for it to work
JS:
$('.purchase-order-button').on('click', function(){
var buildcotable = '';
var buildtrs = $('#formentry15').val();
var coArray = '';
var coArrayNumber = 1;
buildcotable += '<div class="table-responsive">';
buildcotable += '<table class="table table-bordered">';
buildcotable += '<thead>';
buildcotable += '<th class="text-center">CO Number</th>';
buildcotable += '<th class="text-center">CO Price</th>';
buildcotable += '<th class="text-center">Options</th>';
buildcotable += '</thead>';
buildcotable += '<tbody id="jquerypotable">';
//lets do a check and see how many are listed
if(buildtrs.indexOf(',') !== -1){
coArray = buildtrs.split(',');
$.each(coArray, function(){
var splitCoArray = this.split('=');
var coArrayPrice = splitCoArray[1].trim().replace('£', '');
var coArrayCode = splitCoArray[0].trim();
buildcotable += '<tr id="jqueryporow'+coArrayNumber+'">';
buildcotable += '<td><input type="text" value="'+coArrayCode+'" id="jqueryponumber'+coArrayNumber+'" class="form-control"></td>';
buildcotable += '<td><input type="text" value="'+coArrayPrice+'" id="jquerypovalue'+coArrayNumber+'" class="form-control"></td>';
buildcotable += '<td class="text-center"><a class="btn btn-danger delete-co-row" id="deletepo'+coArrayNumber+'">Delete CO Number</a></td>';
buildcotable += '</tr>';
coArrayNumber += 1;
});
} else {
if(buildtrs == '' || buildtrs == 'TBC'){
buildcotable += '<tr id="jqueryporow1">';
buildcotable += '<td><input type="text" value="" id="jqueryponumber1" class="form-control"></td>';
buildcotable += '<td><input type="text" value="" id="jquerypovalue1" class="form-control"></td>';
buildcotable += '<td class="text-center"><a class="btn btn-danger delete-co-row" id="deletepo1">Delete CO Number</a></td>';
buildcotable += '</tr>';
} else {
var splitSingleCoArray = buildtrs.split('=');
var coSinglePrice = splitSingleCoArray[1].trim().replace('£', '');
var coSingleCode = splitSingleCoArray[0].trim();
buildcotable += '<tr id="jqueryporow1">';
buildcotable += '<td><input type="text" value="'+coSingleCode+'" id="jqueryponumber1" class="form-control"></td>';
buildcotable += '<td><input type="text" value="'+coSinglePrice+'" id="jquerypovalue1" class="form-control"></td>';
buildcotable += '<td class="text-center"><a class="btn btn-danger delete-co-row" id="deletepo1">Delete CO Number</a></td>';
buildcotable += '</tr>';
}
}
buildcotable += '</tbody>';
buildcotable += '</table>';
buildcotable += '<p>Add New CO Number</p>';
buildcotable += '<p>Done</p>';
buildcotable += '</div>';
$('.ubl-section-7').html(buildcotable);
$('.ubl-section-7').show();
$('.model-background').fadeIn(500);
//add new row
$('#addnewpo').on('click', function(e){
e.preventDefault();
var numPoRows = $("#jquerypotable > tr").length;
var makeNewRowNum = numPoRows + 1;
var createnewporow = '<tr id="jqueryporow'+makeNewRowNum+'">';
createnewporow += '<td><input type="text" value="" id="jqueryponumber'+makeNewRowNum+'" class="form-control"></td>';
createnewporow += '<td><input type="text" value="" id="jquerypovalue'+makeNewRowNum+'" class="form-control"></td>';
createnewporow += '<td class="text-center"><a class="btn btn-danger delete-co-row-new" id="deletepo'+makeNewRowNum+'">Delete CO Number</a></td>';
createnewporow += '</tr>';
$('#jquerypotable').append(createnewporow);
});
//delete row
$('#jquerypotable > tr').on('click', '.delete-co-row', function(e){
e.preventDefault();
var getCoId = $(this).attr('id');
var coLastChar = parseInt(getCoId.substr(getCoId.length - 1));
var coHowManyRows = parseInt($("#jquerypotable > tr").length);
var makeMinusId = '';
var newi = coLastChar;
if(coLastChar == coHowManyRows){
$('#jqueryporow'+coLastChar).remove();
} else {
//before removing rows we need to rebuild the information given.
for(newi; newi <= coHowManyRows; newi++){
if(newi == coLastChar){
$('#jqueryporow'+newi).remove();
} else {
makeMinusId = (newi - 1);
$('#jqueryporow'+newi).attr('id', 'jqueryporow'+makeMinusId);
$('#jqueryponumber'+newi).attr('id', 'jqueryponumber'+makeMinusId);
$('#jquerypovalue'+newi).attr('id', 'jquerypovalue'+makeMinusId);
$('#deletepo'+newi).attr('id', 'deletepo'+makeMinusId);
}
}
}
});
});
enter link description here
Any help is gratefully received

You added an eventListener to the delete buttons at the initialization of the page but didnt do it again when creating the rows. I suggest adding the following code to your addnewpo button:
$('#addnewpo').on('click', function(e){
// your original code here
//...
//now add an event listener to the new deletebuttons
$('#jquerypotable > tr').on('click', '.delete-co-row-new', function(e){
e.preventDefault();
$(this).closest('tr').remove();
});
});

I Found the issue, the issue was the listener needed to remove the tr.
so instead of:
/now add an event listener to the new deletebuttons
$('#jquerypotable > tr').on('click', '.delete-co-row', function(e){
It needed to be:
/now add an event listener to the new deletebuttons
$('#jquerypotable').on('click', '.delete-co-row', function(e){
Thanks everyone for trying to help :)

How to Insert an Inline Razor Expression into Javascript

I have the following script:
<script type="text/javascript">
function addRow() {
var count = $("#tblUploadDocs").prop('rows').length;
count += 1;
alert(count);
var html = '<tr>';
html += '<td><input type="file" name="files" id="file' + count + '" /></td>';
html += '<td>Bu dilden</td>';
html += '<tr>';
alert(html);
}
</script>
I am trying to insert the following line into the script, but could not achieve the desired result:
<td>#Html.DropDownList("ddlFromLanguage1", ViewBag.Languages as SelectList)</td>
I tried both and #: but could not make it work. I am looking forward to hearing to a solution.
Thanks in advance

Use the <text> pseudo-element, as described here, to force the razor compiler back into content mode:
<script type="text/javascript">
function addRow() {
<text>
var count = $("#tblUploadDocs").prop('rows').length;
count += 1;
alert(count);
var html = '<tr>';
html += '<td><input type="file" name="files" id="file' + count + '" /></td>';
html += '<td>Bu dilden</td>';
html += '<tr>';
alert(html);
</text>
}
</script>