Combo-Box value not passing in AJAX - ajax

Want to pass 4 values in AJAX parameter.First three are passing properly but the fourth one giving problem.i came to know after displaying alert in AJAX
<tr align="left">
<td style="background-color:#1569C7;color:white;font-weight:bold;font-size:110%;border-style:outset;"><center><b>Test Conducted</b></center></td>
<td><select onchange="javascript:type123(document.getElementById('fodate').value,document.getElementById('todate').value,document.getElementById('product').value);" id="testcond" name="testcond">
<option>--Select--</option>
</select></td>
</tr>
AJAX CODE:
<script language="javascript">
var xmlHttp1=null;
function type123(obj,obj1,obj2)
{
//alert(this.value);
var type_value=document.getElementById('testcond').options.selectedIndex.value;
var val1=obj;
var val2=obj1;
var val3=obj2;
// var val4=obj3;
alert(val1);
alert(val2);
alert(val3);
alert(type_value);

Instend of
var type_value=document.getElementById('testcond').options.selectedIndex.value;
You can try this one to get selected value of Combo-Box
var type_value=document.getElementById('testcond').value;<br/>alert(type_value);

Related

Not able to change textbox value on blur

Good Afternoon...
I am trying to do the addition of textbox value and show in another textbox using onBlur but not able to do the same. Textbox are genrated using foreach loop as per ID. ( Ref. Attached Image)
For first textbox, the function gives the value but for next textboxes, not able to get the same.
My Modal Table Code.
<tbody>
#foreach ($buffalodata as $item )
<tr>
<td>{{$item->buffaloID}}</td>
<td><input type="number" id="eachmorningmilk" name="eachmorningmilk" value="00"></td>
<td><input type="number" id="eacheveningmilk" name="eacheveningmilk" value="00"></td>
<td><input type="text" id="eachtotalmilk" name="eachtotalmilk" value="00" readonly></td>
</tr>
#endforeach
</tbody>
Code for Function to run onblur
$("#eachmorningmilk").blur(function(){
eachbmorning = parseInt($("#addmilkbuffalo #eachmorningmilk").val());
eachbevening = parseInt($("#addmilkbuffalo #eacheveningmilk").val());
var eachbuffalototalmilk = eachbmorning + eachbevening;
document.getElementById('eachtotalmilk').value=eachbuffalototalmilk;
})
Thanks in Advance.
$("#eachmorningmilk").blur(function(){...in this statement you specify the id (eachmorningmilk) ..
right?
So what about the next two textbox id .. if you want the same effact on next two textboxs then you need to specify the function in textbox element like ..
$("#eacheveningmilk").blur(function(){
eachbmorning = parseInt($("#addmilkbuffalo #eachmorningmilk").val());
eachbevening = parseInt($("#addmilkbuffalo #eacheveningmilk").val());
var eachbuffalototalmilk = eachbmorning + eachbevening;
document.getElementById('eachtotalmilk').value=eachbuffalototalmilk;
})
And for the another one ..
This is the problem of your code in my point of view
Welcome.🙂

Knockout.js code seems to be working intermittently

We use Knockout.js and MVC in a Webapp and are having an issue, where the order merchandise total observed is 0 by Knockout.js, as displayed in the GUI.
The code seems to be working intermittently, because sometimes we do show the merchandise total in other orders. All orders use the same code and a merchandise total non zero value is always seen in the
OrderDetailClientViewModel object within the controller before being passed to the view. The view is coded in Knockout.js and plain javascript.
The "Totals" property shown below is an object (Models.OrderTotalViewModel), which contains the "MerchandiseTotal" field, which is sometimes showing a 0. I'm showing the relevant parts of the two view files below. I don't see the merchandiseTotal value being modified erroneously in the code. Only helpful segments are shown below.
Any suggestions to fix this intermittent behavior would be greatly appreciated!!!
Thank you,
Ken
--Edit.cshtml
#model Models.OrderEditPageViewModel
...
var rawViewModel = #(Html.ToJson(Model.OrderDetailClientViewModel()));
var viewModel = ko.mapping.fromJS(rawViewModel,
{
'HeaderData': {
create: function(options) {
options.data.StartDate = new Date(options.data.StartDate);
options.data.EndDate = new Date(options.data.EndDate);
var headerData = ko.mapping.fromJS(options.data);
headerData.errors = new HeaderDataError();
return headerData;
}
},
'Totals': {
create: function(options) {
var totals = ko.mapping.fromJS(options.data);
totals.errors = new TotalsError();
totals.isPromoCodeApplied = ko.observable(false);
if ($.trim(totals.PromoCode()) !== "")
totals.isPromoCodeApplied(true);
return totals;
}
}
});
...
-- This segment in Edit.cshtml shows where the OrderTotalViewModel.cshtml is called for Totals.
<tr>
<td colspan="3">
#Html.EditorFor(m => m.Totals)
</td>
</tr>
--OrderTotalViewModel.cshtml
#model Models.OrderTotalViewModel
#{ Layout = null; }
...
<td colspan="3" style="text-align:right">
<table class="PaddedTable" style="width:925px">
<tbody>
<tr>
<td style="width:125px;text-align:right">Merchandise Total:</td>
<td style="text-align:right" class="NormalTextBold">
#(Html.Knockout().SpanFor(m => m.MerchandiseTotal)
.HtmlAttributes(new { #class = "NormalTextBold" })
.Currency())

Knockout Viewmodel binding and Datatable Sorting

I'm using Knockout for data binding and using dataTable+YADCF for Sorting and filtering. My scenario is little complex, on clicking the Category nodes (left side) each time need to make an AJAX call and refresh the table data (right side) through Knockout. This Knockout binding functionality works fine without any issue.
HTML Code
<table class="pdm-data-table pdmList" id="ListCatAttrVal" data-link="row">
<thead>
<tr>
<th>Display Name</th>
<th>Display Source</th>
</tr>
</thead>
<tbody id="listAttribute" data-bind="foreach: attributevalue">
<tr>
<td data-bind="text: dispName"></td>
<td data-bind="text: dispSrc"></td>
</tr>
</table>
Knockout Model Code
if (!ko.dataFor(document.getElementById("listAttribute"))) {
var attributeModel = function () {
this.attributevalue = ko.observableArray();
};
attributeBinding = new attributeModel();
ko.applyBindings(attributeBinding, document.getElementById("listAttribute"));
}
Issue is after applying DataTable for the Table
$("#ListCatAttrVal").dataTable().fnClearTable();
for (var x in response.attributes) {
attributeBinding.attributevalue.push(response.attributes[x]);
}
$("#ListCatAttrVal").dataTable();
After this, Datatable Sorting is not working.
I'm trying to remove the existing generated dataTable and re-initiate it every-time when I click on the category node. But it is not working as expected.
I had a similar issue while working with knockout and datatables - my bindings inside the datatable don't seem to work initially. As a workaround I ended up initialising the datatable in the following way:
var table = $("#ListCatAttrVal").dataTable();
table.fnPageChange(0, true);
After calling fnPageChange (or any other function of datatable library, I believe) bindings seem to be working.

display model contents dynamically in View MVC4

I have a homepage that will display a table with some data for each user. The back-end handles that and I have a list in my model. I am trying to view a dynamic table based on this list and be able to delete elements from without having to hit refresh. I do not know where to start to do something like this. Any help?
Here is what I have so far:
Inside HomePage controller I have an action returning Json representation of the model. Have of 'HpModel' gets set in the login controller and the other is in this one:
public JsonResult GetUserInfo(HomePageModel HpModel)
{
DBOps ops = new DBOps();
HpModel.PhoneDisplay = ops.getDisplayInfo(HpModel.ExtNum);
HpModel.NumberOfLines = HpModel.PhoneDisplay.Count;
return Json(HpModel);
}
In my view I have a javascript to grab this model:
function getInfo() {
alert('here');
$.ajax({
url: '#Url.Action("GetUserInfo", "HomePage")',
data: json,
type: 'POST',
success: function (data) {
alert(data);
}
});
}
I am not sure what is going wrong, and not 100% sure its the way to be done anyway.
Help is appreciated :)
One more idea. You may use jQuery to hide and callback function to $Post to your Delete ActionResult.
For examp: (here I created easy example without $post: jsfiddle)
<script>
$('.delete').click(function()
{
$(this).closest('tr').hide(callback);
function callback() {
$post(/Home/Delete/....
});
</script>
<table>
<tr>
<td>Marry</td>
<td>10 points</td>
<td><a class="delete" href="#">Delete</a></td>
</tr>
<tr>
<td>Jane</td>
<td>8 points</td>
<td><a class="delete" href="#">Delete</a></td>
</tr>
<tr>
<td>Lara</td>
<td>5 points</td>
<td><a class="delete" href="#">Delete</a></td>
</tr>
</table>

How do I render a partial site to another div?

I want a view with a table on the site and when you click on a table Item, i want to update a partial view with the current object I just clicked on. How do I manage to do this?
<table>
#foreach (var a in annotations)
{
<tr>
<td>
<label onclick="change stuff to new Annotation">#a.Title</label>
</td>
</tr>
}
</table>
<div id="stuff">#Html.RenderPartial("Go", "new annotation")"</div>
You're mixing client-side and server-side code. By the time the click event occurs, you're on the client and server-side code has run and finished.
You could render the partial view in a hidden div and just unhide it on the click event. Something similar to this, perhaps:
<table>
#foreach (var a in annotations)
{
<tr>
<td>
<label>#a.Title</label>
<div style="display:none;">#Html.RenderPartial("Go", a)</div>
</td>
</tr>
}
</table>
<script type="text/javascript">
$(function () {
$('table tr td label').click(function () {
$(this).closest('td').find('div').show();
});
});
</script>
There may be a more elegant way to find the correct div in the jQuery selectors, you can perhaps add classes and ids to DOM elements as needed to make it cleaner. If you have a lot of these table rows then I'd also recommend using the jQuery .on() function for binding the click event as it would perform better. Something like this:
<script type="text/javascript">
$(function () {
$('body').on('click', 'table tr td label', function () {
$(this).closest('td').find('div').show();
});
});
</script>
This would bind a single click event to the DOM instead of many, with the added bonus that dynamically added rows would still handle the event after the binding takes place.
your getting your client side and server side code mixed up here.
#Html.RenderPartial("Go", a)
is a server side method that returns some HTML.
<label onclick=
Is client side code. So by the time your client gets the data it looks like this:
<label onclick="The text returned from html.render partial">
I think you need to read up on MVC a bit more to achieve what you want as your fundamentally going down the wrong route here.

Resources