I tried adding the . infront of sum
$('.sum'), that did not work. Now i changed jquery to load from the button, but it still does not work. \\\
@{
Layout = null;
}
<!-- -->
<!DOCTYPE html>
<html>
<head>
<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script>
// data: is the data returned by the controller
var url = "/Home/ReverseTheString";
var stringToReverse = "Bob Cravens";
$.get(url, { input: stringToReverse }, function (data) {
$("#div4").html(data);
});
$("button").click(function () {
$.ajax({
type: 'GET',
data: { a:1 , b:2} ,
url: '@Url.Action("Sum" , "Home")',
success: function (result) {
$("#div2").html(result);
}
}); // closes the ajax
}); // closes click function
}); // closes document ready function
</script>
<script>
var url = "/Home/GetDateTimeString";
$.get(url, null, function (data) {
$("#div2").html(data);
});
var url = "/Home/sum";
$.get(url, null, function (data) {
$("#div7").html(data);
});
var url = "/Home/RegisterUser";
var first = "Bob";
var last = "Cravens";
$.post(url, { firstName: first, lastName: last }, function (data) {
$("#div5").html(data);
});
var f = $("#myForm");
var url = f.attr("action");
var formData = f.serialize();
$.post(url, formData, function (data) {
$("#div6").html(data);
});
// works if div 7,div8,div9 are changed to div4,div5,div6
var url = "/Home/GetContactInfo";
var id = 123;
$.getJSON(url, { personId: id }, function (data) {
$("#div7").html(data.FirstName + " " + data.LastName);
$("#div8").html(data.State);
$("#div9").html(data.Age);
});
var url = "/Home/MyPartialView";
var info = "This is my information."
// note : data is the return data from the controller , we have to specify it here as a parameter for function
$.get(url, null, function (data) {
$("#div1").html(info);
});
</script>
<title>A study of population dynamics</title>
</head>
<body>
<div class="container">
<form id="myForm" action="/Home/FormPost" method="post">
<div id="div1"><h2>Let jQuery AJAX Change This Text</h2></div>
<div id="div2"><h2>Let jQuery AJAX Change This Text</h2></div>
<div id="div3"><h2>Let jQuery AJAX Change This Text</h2></div>
<div id="div4"><h2>Let jQuery AJAX Change This Text</h2></div>
<div id="div5"><h2>Let jQuery AJAX Change This Text</h2></div>
<div id="div6"><h2>Let jQuery AJAX Change This Text</h2></div>
<div id="div7"><h2>Let jQuery AJAX Change This Text</h2></div>
<div id="div8"><h2>Let jQuery AJAX Change This Text</h2></div>
<div id="div9"><h2>Let jQuery AJAX Change This Text</h2></div>
<a href="#" class= "sum"> Sum </a>
<div id="result2"><h2> "result2 "</h2></div>
<div>First Name: <input name="FirstName" type="text" value="Bob" /></div>
<div>Last Name: <input name="LastName" type="text" value="Cravens" /></div>
<div>Age: <input name="Age" type="text" value="43" /></div>
<input type="submit" value="Save Contact" />
<div id="postResult">?</div>
</form>
</div>
<button>Get External Content</button>
</body>
</html>