Menu
I have a dilemma. I receive from a controller 2 objects: an id, and an array of long. When the page is loaded, the checkboxes at the indexes specified by the "tlocations" are ticked. The user then ticks/unticks checkboxes and presses on a "submit-btn".The button makes an AJAX call and saves the changes to the database. However, after the AJAX call, the checkboxes are disabled!
How should i approach this problem if I want the checkboxes to remain disabled after refresh press? Should I create a backend variable that changes state before refresh, and then is sent in the ViewData when the view is rendered the second time? Or are there other ways like cookies?
For more clarification I added the schema. Hope it helps.
Controller
public IActionResult Index()
{
ViewData["tstory"]=JsonConvert.SerializeObject(TempData.Get<Story("tstory"));
if(ViewData["tstory"]!=null)
{
ViewData["tlocations"]=JsonConvert.SerializeObject(TempData.Get<IEnumerable<long>>("tlocations"));
TempData.Keep();
return View(context.Locations);
}
return RedirectToAction("Index","Story");
}
View:
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="~/js/TableOps.js"></script>
<script type="text/javascript" src="~/js/BtnHandlers.js"></script>
<script>
$(document).ready(function(){
var [email protected](ViewData["tstory"]);
var [email protected](ViewData["tlocations"]);
var tableName=$("#table1").attr("id");
Initialize(tableName,indexes,_story);
$("#submit-btn").bind( "click", function(elem) {
var locations=getLocations(tableName);
AttachBtnHandler(locations,function(){checkLocationTable (indexes,tableName);});
});
});
</script>
</head>
Ajax call
function AttachBtnHandler(locations,disableCheckboxes)
{
var result=ajaxCall('post','/Location/Attach',locations);
$("input[type='checkbox']")
.each(function(index,elem){
$(elem).prop("checked",false);
$(elem).prop("disabled",true);
});
}
function ajaxCall(methodType,desturl,payload=null,dataType='json')
{
if(payload==null)
{
return;
}
var response=null;
$.ajax({
type:methodType,
url:desturl,
data:JSON.stringify(payload),
contentType:"application/json;charset=utf-8",
dataType:dataType,
success:function(resp)
{
alert("Values sent successfully!");
response=resp;
},
failure:function(resp)
{
alert("Failure to send data");
response=resp;
},
error:function(xhr, status, error)
{
alert("Error:"+error);
}
});
return response;
}
288
I couldn't even saw your HTML Code but take a look at this:
Code behind
string getStatus = "checked";
bool s = false;
protected void Page_Load(object sender, EventArgs e)
{
}
protected void OnChangeEvent(object sender, EventArgs e)
{
getStatus = CheckBox1.Checked == true ? "checked" : "unchecked";
checkbool();
}
protected bool checkbool()
{
return s = getStatus == "checked" ? true : false;
}
Script:
<script src="Scripts/jquery-1.10.2.js"></script>
<script>
$(document).ready(function () {
$("#CheckBox1").prop("checked", <%=checkbool()%>);
$("#CheckBox1").prop("disabled", true);
});
</script>
HTML
<div>
<asp:CheckBox ID="CheckBox1" runat="server" AutoPostBack="true" OnCheckedChanged="OnChangeEvent"/>
</div>
It will restore the state of your checkbox its either its checked or unchecked even upon refreshing the page.
149
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
