I'm displaying a list of object data in a table that is triggered by a dropdownbox .change function. However, I also need to submit this data to a database. So far, I can display the data when the dropdown changes, but I'm having trouble retrieving the list of objects and sending them to the database upon submit.
You'll notice that one of the properties in the view model is a boolean. This is used to check which Schools are sent to the database.
The last method shown here is called upon submit. When I check which values are being sent to it (through the tmpModel parameter) the Schools list is null. How can I populate this list with the checked Schools?
First, here is the class from my view model that holds the data I want to display and submit.
public class School
{
public int? SchoolId { get; set; }
public string SchoolName { get; set; }
public string TownName { get; set; }
public bool isMoving { get; set; }
}
Next, here is the JsonResult method I'm using to get the list of Schools.
ReorganizationVm model = new ReorganizationVm(); // an instance of my view model
public JsonResult Schools(int townCode, int sauId, int fiscalYear)
{
using (var service = new ParameterService(this.User))
{
try
{
model.Schools = new List<School>();
foreach (var o in service.GetSchools(townCode, sauId, fiscalYear))
{
School School = new School
{
SchoolId = o.School_ID,
SchoolName = o.SchoolName,
TownName = o.TownName,
isMoving = false
};
model.Schools.Add(School);
}
return Json(model.Schools, JsonRequestBehavior.AllowGet);
}
catch (Exception ex)
{
}
return Json(null);
}
}
Here's JavaScript function that calls the controller method and the table from the view.
<script type="text/javascript">
$(function () {
$('#CurrentSau_SauId').change(function () {
var sauId = $("#CurrentSau_SauId").val();
var townCode = $("#Town_TownCode :selected").val();
var fiscalYear = $("#FiscalYear").val();
var schools = $("#schools");
$.ajax({
cache: false,
type: "GET",
url: "#(Url.Action("Schools", "Reorganization"))",
data: { "sauId" : sauId, "townCode" : townCode, "fiscalYear" : fiscalYear },
success: function (data) {
var result = "";
schools.html('');
$.each(data, function (id, school) {
result += '<tr><th>Select Schools that are Moving to New SAU</th></tr>' +
'<tr><th>School Name</th><th>Town</th><th>Moving to New SU</th></tr>' +
'<tr><td>' + school.SchoolName + '</td><td>' + school.TownName + '</td><td>' +
'<input type="checkbox"></td></tr>';
});
schools.html(result);
},
error: function (xhr, AJAXOptions, thrownError) {
alert('Failed to retrieve schools.');
}
});
});
});
</script>
<table id="schools">
</table>
<table>
<tr>
<td>
<input type="submit" value="Submit"/>
</td>
</tr>
</table>
And, lastly, the controller method that is called upon submit. Right now, it's empty because I'm only using it to check which values are getting back.
public ActionResult Index(ReorganizationVm tmpModel)
{
return View();
}
Edit: update*
It's been a while but I've finally had some time to come back to this. After trying the code posted by AmanVirdi, I found that it didn't work. However, I was able to get it to work (for the most part) by adding value attributes to the html. Here is the Jquery that builds the html to be injected into the page. Please also note the id variable was changed to i and rather than using html() to inject the html I'm now using append().
JQuery
$.each(data, function (i, school) {
result +=
'<tr><td>' + school.SchoolName +
'<input type="hidden" name="SchoolList[' + i + '].SchoolName" id="SchoolList[' + i + ']_SchoolName" />' +
'<input type="hidden" name="SchoolList[' + i + '].SchoolId" value="' + school.SchoolId + '" /></td>' +
'<td>' + school.Town +
'<input type="hidden" name="SchoolList[' + i + '].Town" value="' + school.Town + '" /></td>' +
'<td><input type="checkbox" name="SchoolList[' + i + '].IsMoving" value="' + school.SchoolId + '" />';
$("#schools").append(result);
As mentioned, it works for the most part. All the values are being sent to the controller except the isMoving checkbox values remain false for each object in the generated list.
How can I get the isMoving values to change according to whether or not the checboxes are checked? I was reading about CheckBoxListFor and think it might help me, but I'm generating the html directly rather than using Html helpers. Maybe I could replicate the html generated by a CheckBoxListFor. Is this the way to go?
you need to add four hidden fields for each property in "Schools" model class, in the "result" string. Like this:
**jQuery:**Tests[position].Test.Preconditions"
result +='<tr><th>Select Schools that are Moving to New SAU</th></tr>' +
'<tr><th>School Name</th><th>Town</th><th>Moving to New SU</th></tr>' +
'<tr><td><input type="hidden" id="SchoolList['+ id +']_SchoolId" name="SchoolList['+ id +'].SchoolId" />' +
'<input type="hidden" id=""SchoolList['+ id +']_SchoolName" name="SchoolList['+ id +'].SchoolName" />'+school.SchoolName + '</td>' +
'<td><input type="hidden" id="SchoolList['+ id +']_TownName" name="SchoolList['+ id +'].TownName" />' + school.TownName +'</td>' +
'<td><input type="checkbox" id="SchoolList['+ id +']_isMoving" name="SchoolList['+ id +'].isMoving" checked="checked"/></td></tr>';
Html
<form action="Controller/Index" method="get">
<!-- <form action="Controller/SaveData" method="get"> for SaveData method -->
<table id="schools">
</table>
<table>
<tr>
<td>
<input type="submit" value="Submit"/>
</td>
</tr>
</table>
Controller
And add [HttpPost] on the Index method:
[HttpPost]
public ActionResult Index(ReorganizationVm tmpModel)
{
return View();
}
or you can create a separate action method for saving school data.
[HttpPost]
public ActionResult SaveData(ReorganizationVm tmpModel)
{
// do your stuff here
return View("Index");
}
Change your model somthing like this:
public class ReorganizationVm()
{
public List<Schools> SchoolList { get; set; }
}
ReorganizationVm model = new ReorganizationVm(); // an instance of my view model
public JsonResult Schools(int townCode, int sauId, int fiscalYear)
{
using (var service = new ParameterService(this.User))
{
try
{
model.Schools = new List<School>();
foreach (var o in service.GetSchools(townCode, sauId, fiscalYear))
{
School School = new School
{
SchoolId = o.School_ID,
SchoolName = o.SchoolName,
TownName = o.TownName,
isMoving = false
};
model.Schools.Add(School);
}
return Json(model, JsonRequestBehavior.AllowGet); //pass whole model variable
}
catch (Exception ex)
{
}
return Json(null);
}
}
Related
I want to carry data by onclick function to the next page. All data is carried along with by giving parameter but it doesn't return View from the controller. Please help me. I'm stuck in here two days this is my school project.
OnClick button:
<div class="row">
<div class="col-sm-4"></div>
<button class='btn bg-blue next' onclick="checkamt(#Model.TotalAmt)">Next</button>
</div>
Controller:
public ActionResult ComfirmPay(int e = 0, string TaxType = null, int CurrentAmt = 0)
{
ViewBag.TotalAmt = e;
ViewBag.CurrentAmt = CurrentAmt;
ViewBag.TaxType = TaxType;
return View("ComfirmPay");
}
Ajax:
function checkamt(e) {
var amount = #ViewBag.CurrentAmt;
if (amount < e) {
alert('bad');
window.location.href = 'http://localhost:22822/Home/PayTax';
}
else {
alert('good');
$.ajax({
cache: false,
url: '#Url.Action("ComfirmPay", "Home")',
data: { e: e, taxtype: taxtype, currentamt: currentamt },
beforeSend: function () {
},
success: function () {
},
complete: function () {
}
})
}
}
View:
<div class="col-md-9 col-xs-9">
<p class="text-muted">You have total <b class="text-green">#ViewBag.CurrentAmt</b> points</p>
</div>
Remove the ajax function and do this
window.location.href = "#Url.Action("ComfirmPay", "Home")" + "?e=" + e + "&taxtype=" + taxtype + "¤tamt=" + currentamt
The comment on this post explains a little more about why what you are trying to do does not work.
i think for your purpose there is no need of ajax call. you can use window.location.hrefas follows
function checkamt(e) {
var amount = #ViewBag.CurrentAmt;
if (amount < e) {
window.location.href = 'http://localhost:22822/Home/PayTax';
}
else {
window.location.href = '/Home/ComfirmPay?e='+e+'&taxtype='+taxtype+'¤tamt='+currentamt;
}
}
and in the controller
public ActionResult ComfirmPay(string e, string TaxType, string CurrentAmt)
{
ViewBag.TotalAmt = e;
ViewBag.CurrentAmt = CurrentAmt;
ViewBag.TaxType = TaxType;
return View();
}
Im trying serialize form and binding into model, but some how child of model InsertToUsertbls returns NULL. Can any help me please :)
I have the following model:
public class MangeAddUsers
{
public List<InsertToUsertbl> InsertToUsertbls { get; set; }
public class InsertToUsertbl
{
public InsertToUsertbl()
{
}
public int PX2ID { get; set; }
public string CustomerNR { get; set; }
public string SellerPersonCode { get; set; }
public string NameOfCompany { get; set; }
public string CompanyNo { get; set; }
}
}
JavaScript to Get data and than load them into form:
<script>
function uuidv4() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16);
});
}
function myfunction() {
$.ajax({
type: "GET",
url: "/Account/GetCustomerContactInfo",
data: {ids: '10883'},
dataType: 'json',
traditional: true,
success: function (values) {
var holderHTML = "";
for (var i = 0; i < values.length; i++) {
value = values[i]
if (value != null) {
var guid = uuidv4();
holderHTML += '<tr id="row' + value.CustomerNo + '">';
holderHTML += '<input type="hidden" name="InsertToUsertbls.Index" value="' + guid + '" />';
holderHTML += '<td><input class="inpt-tbl" type="hidden" id="CustomerNR" name="InsertToUsertbls[' + guid + '].CustomerNR" value="' + value.CustomerNo + '" /></td>';
holderHTML += '<td><input class="inpt-tbl" type="hidden" id="NameOfCompany" name="InsertToUsertbls[' + guid + '].NameOfCompany" value="' + value.NameOfCompany + '" /></td>';
holderHTML += '<td><input type="hidden" id="CompanyNo" name="InsertToUsertbls[' + guid + '].CompanyNo" value="' + value.CompanyNo + '" /></td>';
holderHTML += '<input type="hidden" id="SellerPersonCode" name="InsertToUsertbls[' + guid + '].SellerPersonCode" value="' + value.SalgePersonCode + '" />';
holderHTML += '</tr>';
}
}
$('#output').append(holderHTML);
},
error: function () {
console.log('something went wrong - debug it!');
}
})
};
</script>
And when data load into form:
<form id="mangeUserFrom">
<div id="output">
<tr id="row10883">
<input type="hidden" name="InsertToUsertbls.Index" value="fd3424ab-160d-4378-af65-ad2b790812ec">
<td>
<input class="inpt-tbl" type="hidden" id="CustomerNR" name="InsertToUsertbls[fd3424ab-160d-4378-af65-ad2b790812ec].CustomerNR" value="10883">
</td>
<td>
<input class="inpt-tbl" type="hidden" id="NameOfCompany" name="InsertToUsertbls[fd3424ab-160d-4378-af65-ad2b790812ec].NameOfCompany" value="Some Name">
</td>
<td>
<input type="hidden" id="CompanyNo" name="InsertToUsertbls[fd3424ab-160d-4378-af65-ad2b790812ec].CompanyNo" value="849">
</td>
<input type="hidden" id="SellerPersonCode" name="InsertToUsertbls[fd3424ab-160d-4378-af65-ad2b790812ec].SellerPersonCode" value="TT">
</tr>
</div>
</form>
<button type="button" id="createuser" onclick="PostForm();">POST</button>
JavaScript for serializing:
<script>
function PostForm() {
var formdata = $("#mangeUserFrom").serializeArray();
console.log(formdata);
$.ajax({
"url": '#Url.Action("MangeCreateUsers", "Account")',
"method": "POST",
"data": formdata,
"dataType": "json",
success: function (data) {
},
error: function () {
console.log('something went wrong - debug it!');
}
});
}
</script>
This is the result of the serialization:
{name: "InsertToUsertbls.Index", value: "fd3424ab-160d-4378-af65-ad2b790812ec"}
{name: "InsertToUsertbls[fd3424ab-160d-4378-af65-ad2b790812ec].CustomerNR", value: "10883"}
{name: "InsertToUsertbls[fd3424ab-160d-4378-af65-ad2b790812ec].NameOfCompany", value: "Some Name"}
{name: "InsertToUsertbls[fd3424ab-160d-4378-af65-ad2b790812ec].CompanyNo", value: "849"}
{name: "InsertToUsertbls[fd3424ab-160d-4378-af65-ad2b790812ec].SellerPersonCode", value: "TT"}
This is my controller method I'm trying to POST to:
[HttpPost]
public JsonResult CreateCustomers(CreateCustomers model)
{
return Json(model, JsonRequestBehavior.AllowGet);
}
Screenshots:
Following is my cascasde dropdown list query. Countries list loading up but non of the states loading up in my dropdown list. if someone can help me to rectify the query please.
public ActionResult CountryList()
{
var countries = db.Countries.OrderBy(x=>x.CountryName).ToList();
// IQueryable countries = Country.GetCountries();
if (HttpContext.Request.IsAjaxRequest())
{
return Json(new SelectList(
countries,
"CountryID",
"CountryName"), JsonRequestBehavior.AllowGet
);
}
return View(countries);
}
public ActionResult StateList(int CountryID)
{
IQueryable <State> states= db.States. Where(x => x.CountryID == CountryID);
if (HttpContext.Request.IsAjaxRequest())
return Json(new SelectList(
states,
"StateID",
"StateName"), JsonRequestBehavior.AllowGet
);
return View(states);
}
following is the View file also containg java script:
#section scripts {
<script type="text/javascript">
$(function () {
$.getJSON("/Dropdown/Countries/List",function (data) {
var items = "<option>---------------------</option>";
$.each(data, function (i, country) {
items += "<option value='" + country.Value + "'>" + country.Text + "</option>";
});
$("#Countries").html(items);
});
$("#Countries").change(function () {
$.getJSON("/Dropdown/States/List/" + $("#Countries > option:selected").attr("value"), function (data) {
var items = "<option>---------------------</option>";
$.each(data, function (i, state) {
items += "<option value='" + state.Value + "'>" + state.Text + "</option>";
});
$("#States").html(items);
});
});
});
</script>
}
<h1>#ViewBag.Title</h1>
#using (Html.BeginForm())
{
<label for="Countries">Countries</label>
<select id="Countries" name="Countries"></select>
<br /><br />
<label for="States">States</label>
<select id="States" name="States"></select>
<br /><br />
<input type="submit" value="Submit" />
}
First of all, your action method name is StateList which expects a parameter named CountryID. But your code is not making a call to your StateList action method with such a querystring param. So fix that.
$("#Countries").change(function () {
$.getJSON("#Url.Action("StateList","Home")?CountryID=" +
$("#Countries").val(), function (data) {
var items = "<option>---------------------</option>";
$.each(data, function (i, state) {
items += "<option value='" + state.Value + "'>" + state.Text + "</option>";
});
$("#States").html(items);
});
});
I also used #Url.Action helper method to get the correct url to the action method with the assumption that your StateList action method belongs to HomeController. Update the parameter according to your real controller name as needed.
Now, In your action method, you should not try to return the IQueryable collection, you may simply project the data to a list of SelectListItem and return that.
public ActionResult StateList(int CountryID)
{
var states = db.States.Where(x => x.CountrId==CountryID).ToList();
//this ToList() call copies the data to a new list variable.
var stateOptions = states.Select(f => new SelectListItem {
Value = f.StateID.ToString(),
Text = f.StateName }
).ToList();
if (HttpContext.Request.IsAjaxRequest())
return Json(stateOptions, JsonRequestBehavior.AllowGet);
return View(states);
}
I have three dropdownlist - Project, Sprint, Story.
Sprint dropdownlist will be binded on the basis of selected Project, Story dropdownlist will be binded on the basis of selected Sprint. On the basis of selected Story, i want to show a webgrid.
what i m doing is:
my Project dropdownlist is on the main view page, Sprint dropdownlist, and Story dropdownlist are two diferent partial views. When i select from Project, selected value is taken in jquery and passed to controller as:
$('#Project').change(function (e) {
e.preventDefault();
var selectedVal = $("#Project").val();
$.ajax({
url: "/Task/BindSprintList",
data: { projectTitle: selectedVal },
type: 'Get',
success: function (result) {
$('#ViewGrid').html(result);
},
error: function () {
alert("something seems wrong");
}
});
});
Now Sprint Dropdown list appears. When i select from Sprint, selected value is taken in jquery and passed to controller as:
$('#Sprint').change(function (e) {
e.preventDefault();
var selectedProjectVal = $("#Project").val();
var selectedSprintVal = $("#Sprint").val();
$.ajax({
url: "/Task/BindStoryList",
data: { projectTitle: selectedProjectVal, sprintTitle: selectedSprintVal },
type: 'Get',
success: function (result) {
$('#ddlStory').html(result); },
error: function (err) {
alert("something seems wrong "+ err);
}
});
});
but now Story Dropdownlist is not displaying.
MainPage.cshtml
<table>
#{
if (ViewBag.ProjectList != null)
{
<tr>
<td>
<h4>SELECT PROJECT </h4>
</td>
<td>
#Html.DropDownList("Project", new SelectList(ViewBag.ProjectList, "Value", "Text"), " -- Select -- ")
</td>
</tr>
}
if (ViewBag.SprintList != null)
{
Html.RenderPartial("PartialSprintDropDown", Model.AsEnumerable());
}
if (ViewBag.StoryList != null)
{
Html.RenderPartial("PartialStoryDropDown", Model.AsEnumerable());
}
}
</table>
PartialSprintDropDown.cshtml
<table>
<tr>
<td>
<h4>SELECT SPRINT</h4>
</td>
<td>
#Html.DropDownList("Sprint", new SelectList(ViewBag.SprintList, "Value", "Text"), " -- Select -- ")
</td>
</tr>
</table>
<script src="~/Script/Task/IndexTask.js" type="text/javascript"></script>
PartialStoryDropDown.cshtml
<div id="ddlStory">
<table>
<tr>
<td>
<h4>SELECT STORY</h4>
</td>
<td>
#Html.DropDownList("Story", new SelectList(ViewBag.StoryList, "Value", "Text"), " -- Select -- ")
</td>
</tr>
</table>
</div>
<script src="~/Script/Task/IndexTask.js" type="text/javascript"></script>
Can anyone suggest me that why Story DropdownList is not displaying. Even when i m debbuging PartialStoryDropDown.cshtml, "ViewBag.StoryList" contains data as expected, but not showing on the page.
I m containing my data in Viewbag.SprintList and Viewbag.StoryList.
SprintDropdownlist is displaying.
How to resolve this ?
BindSprintList()
public ActionResult BindSprintList(string projectTitle)
{
try
{
string Owner = Session["UserName"].ToString();
int? ProjectId = GetProjectID(projectTitle);
var ddlSprint = new List<string>();
List<SelectListItem> items = new List<SelectListItem>();
var querySprint = (from sp in entities.Sprints
where sp.Project_ID == ProjectId && sp.Sprint_Status != "Completed"
select sp).ToList();
foreach (var item in querySprint.ToList())
{
SelectListItem li = new SelectListItem
{
Value = item.Sprint_Title,
Text = item.Sprint_Title
};
items.Add(li);
}
IEnumerable<SelectListItem> List = items;
ViewBag.SprintList = new SelectList(List, "Value", "Text");
}
catch (Exception e)
{
var sw = new System.IO.StreamWriter(filename, true);
sw.WriteLine("Date :: " + DateTime.Now.ToString());
sw.WriteLine("Location :: AgileMVC >> Controllers >> TaskController.cs >> public ActionResult BindSprintList(string projectTitle)");
sw.WriteLine("Message :: " + e.Message);
sw.WriteLine(Environment.NewLine);
sw.Close();
}
return PartialView("PartialSprintDropDown", ViewBag.SprintList);
}
BindStoryList()
public ActionResult BindStoryList(string projectTitle, string sprintTitle)
{
try
{
string Owner = Session["UserName"].ToString();
int? ProjectId = GetProjectID(projectTitle);
int? SprintId = GetSprintID(ProjectId, sprintTitle);
var ddlStory = new List<string>();
List<SelectListItem> items = new List<SelectListItem>();
var queryStory = (from st in entities.Stories
join spss in entities.SprintStories on st.Story_ID equals spss.Story_ID
where spss.Sprint_ID == SprintId && spss.Project_ID == ProjectId
select st).ToList();
foreach (var item in queryStory.ToList())
{
SelectListItem li = new SelectListItem
{
Value = item.Story_Title,
Text = item.Story_Title
};
items.Add(li);
}
IEnumerable<SelectListItem> List = items;
ViewBag.StoryList = new SelectList(List, "Value", "Text");
}
catch (Exception e)
{
var sw = new System.IO.StreamWriter(filename, true);
sw.WriteLine("Date :: " + DateTime.Now.ToString());
sw.WriteLine("Location :: AgileMVC >> Controllers >> TaskController.cs >> public ActionResult BindStoryList()");
sw.WriteLine("Message :: " + e.Message);
sw.WriteLine(Environment.NewLine);
sw.Close();
}
return PartialView("PartialStoryDropDown", ViewBag.StoryList);
}
I think I see your problem - ddlStory div comes as part of result. So when you say $('#ddlStory'), it doesn't do anything since its not on the page yet.
I think in your main page, you need to have a placeholder for ddlStory and replace that placeholder's html. Something like $('#ddlStoryWrapper').html(result) where ddlStoryWrapper is just an empty div on the page.
I wanna make twitter like microblog site which other users can follow my posts.
For that i made page with all currently registered users. In front of each name there is button to follow/unfollow user. (Like in Twitter)
View -
#{
ViewBag.Title = "Users";
}
#model MembershipUserCollection
#foreach (MembershipUser item in Model)
{
if(User.Identity.Name != item.UserName)
{
<li>#item.UserName
<span id="sp-#item.UserName"><input id="#item.UserName" name="submit" type="submit" value="Follow" class="follow-user fg-button ui-state-default"/></span>
</li>
}
}
<script type="text/javascript">
$(".follow-user").live("click", function (e) {
e.preventDefault();
var data = $(this).attr("id");
var spid = '#sp-' + data;
var btnid = '#' + data;
var val = $(this).attr('value');
$.ajax({
type: "POST",
url: "User/FollowUser",
data: { id: data },
cache: false,
dataType: "json",
success: function () {
if (val == 'Follow') {
$(btnid).attr('value', 'Unfollow');
}
else {
$(btnid).attr('value', 'Follow');
}
}
});
});
</script>
Controller -
public ActionResult Index()
{
return View(Membership.GetAllUsers());
}
public void FollowUser(string id)
{
ViewData["test"] = "test";
var n = FollowingUser.CreateFollowingUser(0);
n.FollowingId = id;
n.FollowerId = User.Identity.Name;
string message = string.Empty;
var list = new List<FollowingUser>();
list = (from a in db.FollowingUsers where a.FollowerId == User.Identity.Name && a.FollowingId == id select a).ToList();
if (list.Count() == 0)
{
try
{
db.AddToFollowingUsers(n);
db.SaveChanges();
}
catch (Exception ex)
{
message = ex.Message;
}
}
else
{
db.DeleteObject((from a in db.FollowingUsers where a.FollowerId == User.Identity.Name select a).FirstOrDefault());
db.SaveChanges();
}
}
FollowingUsers Table -
Now i wanna change button status on page load checking database whether he is already followed or not.
Ex- If user already followed it should display like below.
When you show this view to a user where this button is displayed, Load the status also, if the person is following or not.
public ActionResult Index()
{
var model = new MemberShipViewModel();
//We check here if the logged in user is already following the user being viewd
foreach(var member in Membership.GetAllUsers())
{
var user = (from a in db.FollowingUsers where a.FollowerId == User.Identity.Name && a.FollowingId == member.UserName select a).FirstOrDefault();
model.Members.Add(new Member{UserName = member.UserName,IsFollowing=user!=null});
}
//This line will remove the logged in user.
model.Members.Remove(model.Members.First(m=>m.UserName==User.Identity.Name));
return view(model);
}
In your index view model, you need to make some changes.
#model MemberShipViewModel
#foreach (var item in Model)
{
<li>#item.UserName
if(!item.IsFollowing)
{
<span id="sp-#item.UserName"><input id="#item.UserName" name="submit" type="submit" value="Follow" class="follow-user fg-button ui-state-default"/></span>
}
else
{
<span id="sp-#item.UserName"><input id="#item.UserName" name="submit" type="submit" value="Follow" class="unfollow-user fg-button ui-state-default"/></span>
}
</li>
}
$(".follow-user").live("click", function (e) {
e.preventDefault();
var data = $(this).attr("id");
var spid = '#sp-' + data;
var btnid = '#' + data;
var val = $(this).attr('value');
$.ajax({
type: "POST",
url: "User/FollowUser",
data: { id: data },
cache: false,
dataType: "json",
success: function () {
if (val == 'Follow') {
$(btnid).attr('value', 'Unfollow');
}
else {
$(btnid).attr('value', 'Follow');
}
}
});
});
You need to write some javascript now. Nobody is going to write full software for you.
Seems you are missing very basic programming skills.
cheers