You should loop and create tr and inside tr need to create the tds.
What you are doing is inside the tr you are looping and generating the tds only.
Change with the below html.
<table style="width: 100%;">
<tr>
<td style="width: 65%;">
This is test Description for data.Please from DropDownList
</td>
<td id="txtData" style="width: 35%;">
@Html.DropDownList("DDLDescription", new List<selectlistitem>
{ new SelectListItem{ Text="Product", Value = "0" }, new SelectListItem{ Text="Price",
Value = "1" } }, new { style = "width: 100px;" }) }
</td>
</tr>
@foreach (var item in (List<productitems>)ViewBag.ProductItems)
{
<tr>
<td class="PItem" style="width:65%;">
<span>@item.Price</span>
<input type="text" value="@item.Price" style="display:none" />
</td>
<td style="width:35%;">
<button href="javascript:;" data-toggle="tooltip" data-placement="top" title="Edit" type="button" class="btn btn-default btn-sm Edit">
<span class="glyphicon glyphicon-edit"></span>
</button>
<button href="javascript:;" data-toggle="tooltip" data-placement="top" title="Update" type="button" style="display:none" class="btn btn-default btn-sm Update">
<span class="glyphicon glyphicon-floppy-save"></span>
</button>
<button href="javascript:;" type="button" data-toggle="tooltip" data-placement="top" title="Cancel" style="display:none" class="btn btn-default btn-sm Cancel">
<span class="glyphicon glyphicon-remove"></span>
</button>
<button href="javascript:;" data-toggle="tooltip" data-placement="top" title="Delete" type="button" class="btn btn-default btn-sm Delete">
<span class="glyphicon glyphicon-remove-sign"></span>
</button>
</td>
</tr>
}
<tr>
<td style="width: 65%;">
<input type="text" id="txtPrice" style="width: 90%" />
</td>
<td style="width: 35%;">
<input type="button" id="btnAdd" value="Add" />
</td>
</tr>
</table>
