I come from a .net Websites world but now I'm using .Net Core. I'm trying to find debug this code in a CSHTML file but you can't add a breakpoint? I'm using VS 2019 and trying to see more about this button which is here:
<div class="shiptype-ship" style="display: none;">
<button id="btnNext_Ship" class="btn btn-primary" disabled="disabled">Ready for Accounting Approval</button>
</div>
and it works down on this JS code in the CSHTML page:
btnNext_Ship.on('click', async function () {
divLoadingOverlay.show();
PopulateMessage(divMessage, null, null);
const uploadedPhotoCount = divImages.find('img').length;
const isUseCustomerAccount = chkUseCustomerAccount.prop('checked');
const customerAccountInfo = txtCustomerAccountInfo.val().trim();
let shippingCost_Total = 0;
let isValidInputs = true;
if (isShipType_Partial) {
const minImageCount = tblSalesOrderItems.find(`tbody tr td[name="tdSerialNos"] ul li[data-salesordershipmentdeliveryid="${salesOrderShipmentDelivery.Id}"]`).closest('tr').length;
if (minImageCount === 0) {
PopulateMessage(divMessage, 'Items must be verified first.', 'error');
isValidInputs = false;
}
else if (isRequirePhotos && uploadedPhotoCount < minImageCount) {
PopulateMessage(divMessage, 'Verified item must have at least 1 photo.', 'error');
isValidInputs = false;
}
else if (isShipType_Ship && tblSalesOrderPallets.find('tr[data-isverifyitemsincomplete="true"]').length > 0) {
PopulateMessage(divMessage, 'To deliver a pallet, all items in it must be verified.', 'error');
isValidInputs = false;
}
}
else {
const minPhotoCount = tblSalesOrderItems.find('tbody tr').length;
const salesOrderItemRows = tblSalesOrderItems.find('tbody tr');
let allItemsVerified = true;
for (let i = 0; i < salesOrderItemRows.length; i++) {
const $row = $(salesOrderItemRows[i]);
if (parseInt($row.attr('data-quantityverified')) < parseInt($row.find('td[name="tdQuantity_Picked"]').text())) {
allItemsVerified = false;
break;
}
}
if (!allItemsVerified) {
PopulateMessage(divMessage, 'Each item must be verified.', 'error');
isValidInputs = false;
}
else if (isRequirePhotos && uploadedPhotoCount < minPhotoCount) {
PopulateMessage(divMessage, 'Verified item must have at least 1 photo.', 'error');
isValidInputs = false;
}
}
if (isValidInputs) {
if (isUseCustomerAccount) {
if (customerAccountInfo.length === 0) {
PopulateMessage(divMessage, 'Customer Account Info is required.', 'error');
isValidInputs = false;
}
}
else {
shippingCost_Total = parseFloat(tblSalesOrderPallets.find('tfoot tr td input[name="txtShippingCost_Total"]').val()) || 0;
if (shippingCost_Total <= 0) {
PopulateMessage(divMessage, 'Cost per pallet or Total Cost is required.', 'error');
isValidInputs = false;
}
}
}
if (isValidInputs) {
const params = new URLSearchParams({
salesOrderShipmentId: salesOrderShipment.Id
});
const result = await fetch(`${api}LastWriteBackOn&${params}`, { credentials: 'same-origin' })
.then(response => {
if (response.ok === false) {
throw response;
}
return response.json();
})
.catch(response => {
PopulateMessage(divMessage, response.statusText || response.message, 'error');
});
if (result) {
if (result.MessageType === 'success') {
if (result.LastWriteBackOn === null) {
divStarShipNotification.attr('data-customeraccountinfo', customerAccountInfo);
divStarShipNotification.attr('data-shippingcosttotal', shippingCost_Total);
divStarShipNotification.modal('show');
}
else {
await SendToAccounting_ShipType_Ship(customerAccountInfo, shippingCost_Total);
}
}
else {
PopulateMessage(divMessage, result.Message, result.MessageType);
}
}
}
divLoadingOverlay.hide();
});
Thing is, I don't see "btnNext_Ship" in the code behind page and can't debug the cshtml page to test the JS code or how it connects to the code behind? Trying to locate a select for billing routine that's tied to this or see how it connects to this but just unable to connect the dots. Is there a way to do it? I'm looking on the web or in here and not seeing anything in relation to this? In a new job and the previous guy left before I was even hired so I'm flying solo.
Thanks!
I have an old system which uses UpdatePanels of asp.net
After the postback is completed, we know that the inside of UpdatePanel is updated
Can i delay this update somehow on the client side ? is that possible?
So it will be like, when the postback is started, i set a javascript datetime object on the client side
Once the postback is completed, and the data is returned from the server, before updating the client side interface, i check how many miliseconds has passed and I delay the update of the client side until certain miliseconds has passed
is this possible?
asp.net 4.5 c#
let me clarify better
i want each update of the page to be exactly 500 miliseconds after the ajax postback request started
however the server delay is unknown and changes for the every location
let say that for person 1 the server delay is 122 ms
for person 2 the server delay is 234
for person 3 the server delay is 444
so i would be have to delay the page update at the client side
for the person 1 : 378 ms
for the person 2 : 266 ms
for the person 3 : 56 ms
i have checked and i found that there is a function :
Sys.WebForms.PageRequestManager pageLoading Event
so if i can somehow override the function that this function calls to update the page i can achieve
(i still dont know what function it calls to complete the update operation on the client side)
lets assume that inside
Sys.WebForms.PageRequestManager pageLoading Event
updateTheChanges function is called
so if i can override this updateTheChanges function and call it with a delay i can achieve what i want
I need exactly something like this which will overwrite the update function of the updatepanel. So i can call this function with a delay
ASP.Net Webforms w/ AJAX Slow Rendering
ty
here the web resource files
script resource 1 : http://pastebin.com/0rSCMn3g
script resource 2 : http://pastebin.com/GvqwpPv8
script resource 3 below
function WebForm_PostBackOptions(eventTarget, eventArgument, validation, validationGroup, actionUrl, trackFocus, clientSubmit) {
this.eventTarget = eventTarget;
this.eventArgument = eventArgument;
this.validation = validation;
this.validationGroup = validationGroup;
this.actionUrl = actionUrl;
this.trackFocus = trackFocus;
this.clientSubmit = clientSubmit;
}
function WebForm_DoPostBackWithOptions(options) {
var validationResult = true;
if (options.validation) {
if (typeof(Page_ClientValidate) == 'function') {
validationResult = Page_ClientValidate(options.validationGroup);
}
}
if (validationResult) {
if ((typeof(options.actionUrl) != "undefined") && (options.actionUrl != null) && (options.actionUrl.length > 0)) {
theForm.action = options.actionUrl;
}
if (options.trackFocus) {
var lastFocus = theForm.elements["__LASTFOCUS"];
if ((typeof(lastFocus) != "undefined") && (lastFocus != null)) {
if (typeof(document.activeElement) == "undefined") {
lastFocus.value = options.eventTarget;
} else {
var active = document.activeElement;
if ((typeof(active) != "undefined") && (active != null)) {
if ((typeof(active.id) != "undefined") && (active.id != null) && (active.id.length > 0)) {
lastFocus.value = active.id;
} else if (typeof(active.name) != "undefined") {
lastFocus.value = active.name;
}
}
}
}
}
}
if (options.clientSubmit) {
__doPostBack(options.eventTarget, options.eventArgument);
}
}
var __pendingCallbacks = new Array();
var __synchronousCallBackIndex = -1;
function WebForm_DoCallback(eventTarget, eventArgument, eventCallback, context, errorCallback, useAsync) {
var postData = __theFormPostData +
"__CALLBACKID=" + WebForm_EncodeCallback(eventTarget) +
"&__CALLBACKPARAM=" + WebForm_EncodeCallback(eventArgument);
if (theForm["__EVENTVALIDATION"]) {
postData += "&__EVENTVALIDATION=" + WebForm_EncodeCallback(theForm["__EVENTVALIDATION"].value);
}
var xmlRequest, e;
try {
xmlRequest = new XMLHttpRequest();
} catch (e) {
try {
xmlRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
var setRequestHeaderMethodExists = true;
try {
setRequestHeaderMethodExists = (xmlRequest && xmlRequest.setRequestHeader);
} catch (e) {}
var callback = new Object();
callback.eventCallback = eventCallback;
callback.context = context;
callback.errorCallback = errorCallback;
callback.async = useAsync;
var callbackIndex = WebForm_FillFirstAvailableSlot(__pendingCallbacks, callback);
if (!useAsync) {
if (__synchronousCallBackIndex != -1) {
__pendingCallbacks[__synchronousCallBackIndex] = null;
}
__synchronousCallBackIndex = callbackIndex;
}
if (setRequestHeaderMethodExists) {
xmlRequest.onreadystatechange = WebForm_CallbackComplete;
callback.xmlRequest = xmlRequest;
// e.g. http:
var action = theForm.action || document.location.pathname,
fragmentIndex = action.indexOf('#');
if (fragmentIndex !== -1) {
action = action.substr(0, fragmentIndex);
}
if (!__nonMSDOMBrowser) {
var queryIndex = action.indexOf('?');
if (queryIndex !== -1) {
var path = action.substr(0, queryIndex);
if (path.indexOf("%") === -1) {
action = encodeURI(path) + action.substr(queryIndex);
}
} else if (action.indexOf("%") === -1) {
action = encodeURI(action);
}
}
xmlRequest.open("POST", action, true);
xmlRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=utf-8");
xmlRequest.send(postData);
return;
}
callback.xmlRequest = new Object();
var callbackFrameID = "__CALLBACKFRAME" + callbackIndex;
var xmlRequestFrame = document.frames[callbackFrameID];
if (!xmlRequestFrame) {
xmlRequestFrame = document.createElement("IFRAME");
xmlRequestFrame.width = "1";
xmlRequestFrame.height = "1";
xmlRequestFrame.frameBorder = "0";
xmlRequestFrame.id = callbackFrameID;
xmlRequestFrame.name = callbackFrameID;
xmlRequestFrame.style.position = "absolute";
xmlRequestFrame.style.top = "-100px"
xmlRequestFrame.style.left = "-100px";
try {
if (callBackFrameUrl) {
xmlRequestFrame.src = callBackFrameUrl;
}
} catch (e) {}
document.body.appendChild(xmlRequestFrame);
}
var interval = window.setInterval(function() {
xmlRequestFrame = document.frames[callbackFrameID];
if (xmlRequestFrame && xmlRequestFrame.document) {
window.clearInterval(interval);
xmlRequestFrame.document.write("");
xmlRequestFrame.document.close();
xmlRequestFrame.document.write('<html><body><form method="post"><input type="hidden" name="__CALLBACKLOADSCRIPT" value="t"></form></body></html>');
xmlRequestFrame.document.close();
xmlRequestFrame.document.forms[0].action = theForm.action;
var count = __theFormPostCollection.length;
var element;
for (var i = 0; i < count; i++) {
element = __theFormPostCollection[i];
if (element) {
var fieldElement = xmlRequestFrame.document.createElement("INPUT");
fieldElement.type = "hidden";
fieldElement.name = element.name;
fieldElement.value = element.value;
xmlRequestFrame.document.forms[0].appendChild(fieldElement);
}
}
var callbackIdFieldElement = xmlRequestFrame.document.createElement("INPUT");
callbackIdFieldElement.type = "hidden";
callbackIdFieldElement.name = "__CALLBACKID";
callbackIdFieldElement.value = eventTarget;
xmlRequestFrame.document.forms[0].appendChild(callbackIdFieldElement);
var callbackParamFieldElement = xmlRequestFrame.document.createElement("INPUT");
callbackParamFieldElement.type = "hidden";
callbackParamFieldElement.name = "__CALLBACKPARAM";
callbackParamFieldElement.value = eventArgument;
xmlRequestFrame.document.forms[0].appendChild(callbackParamFieldElement);
if (theForm["__EVENTVALIDATION"]) {
var callbackValidationFieldElement = xmlRequestFrame.document.createElement("INPUT");
callbackValidationFieldElement.type = "hidden";
callbackValidationFieldElement.name = "__EVENTVALIDATION";
callbackValidationFieldElement.value = theForm["__EVENTVALIDATION"].value;
xmlRequestFrame.document.forms[0].appendChild(callbackValidationFieldElement);
}
var callbackIndexFieldElement = xmlRequestFrame.document.createElement("INPUT");
callbackIndexFieldElement.type = "hidden";
callbackIndexFieldElement.name = "__CALLBACKINDEX";
callbackIndexFieldElement.value = callbackIndex;
xmlRequestFrame.document.forms[0].appendChild(callbackIndexFieldElement);
xmlRequestFrame.document.forms[0].submit();
}
}, 10);
}
function WebForm_CallbackComplete() {
for (var i = 0; i < __pendingCallbacks.length; i++) {
callbackObject = __pendingCallbacks[i];
if (callbackObject && callbackObject.xmlRequest && (callbackObject.xmlRequest.readyState == 4)) {
if (!__pendingCallbacks[i].async) {
__synchronousCallBackIndex = -1;
}
__pendingCallbacks[i] = null;
var callbackFrameID = "__CALLBACKFRAME" + i;
var xmlRequestFrame = document.getElementById(callbackFrameID);
if (xmlRequestFrame) {
xmlRequestFrame.parentNode.removeChild(xmlRequestFrame);
}
WebForm_ExecuteCallback(callbackObject);
}
}
}
function WebForm_ExecuteCallback(callbackObject) {
var response = callbackObject.xmlRequest.responseText;
if (response.charAt(0) == "s") {
if ((typeof(callbackObject.eventCallback) != "undefined") && (callbackObject.eventCallback != null)) {
callbackObject.eventCallback(response.substring(1), callbackObject.context);
}
} else if (response.charAt(0) == "e") {
if ((typeof(callbackObject.errorCallback) != "undefined") && (callbackObject.errorCallback != null)) {
callbackObject.errorCallback(response.substring(1), callbackObject.context);
}
} else {
var separatorIndex = response.indexOf("|");
if (separatorIndex != -1) {
var validationFieldLength = parseInt(response.substring(0, separatorIndex));
if (!isNaN(validationFieldLength)) {
var validationField = response.substring(separatorIndex + 1, separatorIndex + validationFieldLength + 1);
if (validationField != "") {
var validationFieldElement = theForm["__EVENTVALIDATION"];
if (!validationFieldElement) {
validationFieldElement = document.createElement("INPUT");
validationFieldElement.type = "hidden";
validationFieldElement.name = "__EVENTVALIDATION";
theForm.appendChild(validationFieldElement);
}
validationFieldElement.value = validationField;
}
if ((typeof(callbackObject.eventCallback) != "undefined") && (callbackObject.eventCallback != null)) {
callbackObject.eventCallback(response.substring(separatorIndex + validationFieldLength + 1), callbackObject.context);
}
}
}
}
}
function WebForm_FillFirstAvailableSlot(array, element) {
var i;
for (i = 0; i < array.length; i++) {
if (!array[i]) break;
}
array[i] = element;
return i;
}
var __nonMSDOMBrowser = (window.navigator.appName.toLowerCase().indexOf('explorer') == -1);
var __theFormPostData = "";
var __theFormPostCollection = new Array();
var __callbackTextTypes = /^(text|password|hidden|search|tel|url|email|number|range|color|datetime|date|month|week|time|datetime-local)$/i;
function WebForm_InitCallback() {
var formElements = theForm.elements,
count = formElements.length,
element;
for (var i = 0; i < count; i++) {
element = formElements[i];
var tagName = element.tagName.toLowerCase();
if (tagName == "input") {
var type = element.type;
if ((__callbackTextTypes.test(type) || ((type == "checkbox" || type == "radio") && element.checked)) && (element.id != "__EVENTVALIDATION")) {
WebForm_InitCallbackAddField(element.name, element.value);
}
} else if (tagName == "select") {
var selectCount = element.options.length;
for (var j = 0; j < selectCount; j++) {
var selectChild = element.options[j];
if (selectChild.selected == true) {
WebForm_InitCallbackAddField(element.name, element.value);
}
}
} else if (tagName == "textarea") {
WebForm_InitCallbackAddField(element.name, element.value);
}
}
}
function WebForm_InitCallbackAddField(name, value) {
var nameValue = new Object();
nameValue.name = name;
nameValue.value = value;
__theFormPostCollection[__theFormPostCollection.length] = nameValue;
__theFormPostData += WebForm_EncodeCallback(name) + "=" + WebForm_EncodeCallback(value) + "&";
}
function WebForm_EncodeCallback(parameter) {
if (encodeURIComponent) {
return encodeURIComponent(parameter);
} else {
return escape(parameter);
}
}
var __disabledControlArray = new Array();
function WebForm_ReEnableControls() {
if (typeof(__enabledControlArray) == 'undefined') {
return false;
}
var disabledIndex = 0;
for (var i = 0; i < __enabledControlArray.length; i++) {
var c;
if (__nonMSDOMBrowser) {
c = document.getElementById(__enabledControlArray[i]);
} else {
c = document.all[__enabledControlArray[i]];
}
if ((typeof(c) != "undefined") && (c != null) && (c.disabled == true)) {
c.disabled = false;
__disabledControlArray[disabledIndex++] = c;
}
}
setTimeout("WebForm_ReDisableControls()", 0);
return true;
}
function WebForm_ReDisableControls() {
for (var i = 0; i < __disabledControlArray.length; i++) {
__disabledControlArray[i].disabled = true;
}
}
function WebForm_SimulateClick(element, event) {
var clickEvent;
if (element) {
if (element.click) {
element.click();
} else {
clickEvent = document.createEvent("MouseEvents");
clickEvent.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
if (!element.dispatchEvent(clickEvent)) {
return true;
}
}
event.cancelBubble = true;
if (event.stopPropagation) {
event.stopPropagation();
}
return false;
}
return true;
}
function WebForm_FireDefaultButton(event, target) {
if (event.keyCode == 13) {
var src = event.srcElement || event.target;
if (src &&
((src.tagName.toLowerCase() == "input") &&
(src.type.toLowerCase() == "submit" || src.type.toLowerCase() == "button")) ||
((src.tagName.toLowerCase() == "a") &&
(src.href != null) && (src.href != "")) ||
(src.tagName.toLowerCase() == "textarea")) {
return true;
}
var defaultButton;
if (__nonMSDOMBrowser) {
defaultButton = document.getElementById(target);
} else {
defaultButton = document.all[target];
}
if (defaultButton) {
return WebForm_SimulateClick(defaultButton, event);
}
}
return true;
}
function WebForm_GetScrollX() {
if (__nonMSDOMBrowser) {
return window.pageXOffset;
} else {
if (document.documentElement && document.documentElement.scrollLeft) {
return document.documentElement.scrollLeft;
} else if (document.body) {
return document.body.scrollLeft;
}
}
return 0;
}
function WebForm_GetScrollY() {
if (__nonMSDOMBrowser) {
return window.pageYOffset;
} else {
if (document.documentElement && document.documentElement.scrollTop) {
return document.documentElement.scrollTop;
} else if (document.body) {
return document.body.scrollTop;
}
}
return 0;
}
function WebForm_SaveScrollPositionSubmit() {
if (__nonMSDOMBrowser) {
theForm.elements['__SCROLLPOSITIONY'].value = window.pageYOffset;
theForm.elements['__SCROLLPOSITIONX'].value = window.pageXOffset;
} else {
theForm.__SCROLLPOSITIONX.value = WebForm_GetScrollX();
theForm.__SCROLLPOSITIONY.value = WebForm_GetScrollY();
}
if ((typeof(this.oldSubmit) != "undefined") && (this.oldSubmit != null)) {
return this.oldSubmit();
}
return true;
}
function WebForm_SaveScrollPositionOnSubmit() {
theForm.__SCROLLPOSITIONX.value = WebForm_GetScrollX();
theForm.__SCROLLPOSITIONY.value = WebForm_GetScrollY();
if ((typeof(this.oldOnSubmit) != "undefined") && (this.oldOnSubmit != null)) {
return this.oldOnSubmit();
}
return true;
}
function WebForm_RestoreScrollPosition() {
if (__nonMSDOMBrowser) {
window.scrollTo(theForm.elements['__SCROLLPOSITIONX'].value, theForm.elements['__SCROLLPOSITIONY'].value);
} else {
window.scrollTo(theForm.__SCROLLPOSITIONX.value, theForm.__SCROLLPOSITIONY.value);
}
if ((typeof(theForm.oldOnLoad) != "undefined") && (theForm.oldOnLoad != null)) {
return theForm.oldOnLoad();
}
return true;
}
function WebForm_TextBoxKeyHandler(event) {
if (event.keyCode == 13) {
var target;
if (__nonMSDOMBrowser) {
target = event.target;
} else {
target = event.srcElement;
}
if ((typeof(target) != "undefined") && (target != null)) {
if (typeof(target.onchange) != "undefined") {
target.onchange();
event.cancelBubble = true;
if (event.stopPropagation) event.stopPropagation();
return false;
}
}
}
return true;
}
function WebForm_TrimString(value) {
return value.replace(/^\s+|\s+$/g, '')
}
function WebForm_AppendToClassName(element, className) {
var currentClassName = ' ' + WebForm_TrimString(element.className) + ' ';
className = WebForm_TrimString(className);
var index = currentClassName.indexOf(' ' + className + ' ');
if (index === -1) {
element.className = (element.className === '') ? className : element.className + ' ' + className;
}
}
function WebForm_RemoveClassName(element, className) {
var currentClassName = ' ' + WebForm_TrimString(element.className) + ' ';
className = WebForm_TrimString(className);
var index = currentClassName.indexOf(' ' + className + ' ');
if (index >= 0) {
element.className = WebForm_TrimString(currentClassName.substring(0, index) + ' ' +
currentClassName.substring(index + className.length + 1, currentClassName.length));
}
}
function WebForm_GetElementById(elementId) {
if (document.getElementById) {
return document.getElementById(elementId);
} else if (document.all) {
return document.all[elementId];
} else return null;
}
function WebForm_GetElementByTagName(element, tagName) {
var elements = WebForm_GetElementsByTagName(element, tagName);
if (elements && elements.length > 0) {
return elements[0];
} else return null;
}
function WebForm_GetElementsByTagName(element, tagName) {
if (element && tagName) {
if (element.getElementsByTagName) {
return element.getElementsByTagName(tagName);
}
if (element.all && element.all.tags) {
return element.all.tags(tagName);
}
}
return null;
}
function WebForm_GetElementDir(element) {
if (element) {
if (element.dir) {
return element.dir;
}
return WebForm_GetElementDir(element.parentNode);
}
return "ltr";
}
function WebForm_GetElementPosition(element) {
var result = new Object();
result.x = 0;
result.y = 0;
result.width = 0;
result.height = 0;
if (element.offsetParent) {
result.x = element.offsetLeft;
result.y = element.offsetTop;
var parent = element.offsetParent;
while (parent) {
result.x += parent.offsetLeft;
result.y += parent.offsetTop;
var parentTagName = parent.tagName.toLowerCase();
if (parentTagName != "table" &&
parentTagName != "body" &&
parentTagName != "html" &&
parentTagName != "div" &&
parent.clientTop &&
parent.clientLeft) {
result.x += parent.clientLeft;
result.y += parent.clientTop;
}
parent = parent.offsetParent;
}
} else if (element.left && element.top) {
result.x = element.left;
result.y = element.top;
} else {
if (element.x) {
result.x = element.x;
}
if (element.y) {
result.y = element.y;
}
}
if (element.offsetWidth && element.offsetHeight) {
result.width = element.offsetWidth;
result.height = element.offsetHeight;
} else if (element.style && element.style.pixelWidth && element.style.pixelHeight) {
result.width = element.style.pixelWidth;
result.height = element.style.pixelHeight;
}
return result;
}
function WebForm_GetParentByTagName(element, tagName) {
var parent = element.parentNode;
var upperTagName = tagName.toUpperCase();
while (parent && (parent.tagName.toUpperCase() != upperTagName)) {
parent = parent.parentNode ? parent.parentNode : parent.parentElement;
}
return parent;
}
function WebForm_SetElementHeight(element, height) {
if (element && element.style) {
element.style.height = height + "px";
}
}
function WebForm_SetElementWidth(element, width) {
if (element && element.style) {
element.style.width = width + "px";
}
}
function WebForm_SetElementX(element, x) {
if (element && element.style) {
element.style.left = x + "px";
}
}
function WebForm_SetElementY(element, y) {
if (element && element.style) {
element.style.top = y + "px";
}
}
Here is a way to delay the UpdatePanel refresh without freezing the user interface:
In the pageLoading event handler, save the ID and the previous HTML of the panels to be updated
In the pageLoad event handler, save the new HTML of the panels but replace it by the old one
After the delay expires, set the new HTML in the updated panels
Here is the client code:
<script type="text/javascript">
var updateTime = 0;
var updatedPanelArray = [];
function setUpdateTime() {
updateTime = new Date(Date.now() + 500);
}
function pageLoading(sender, e) {
updatedPanelArray.length = 0;
var panels = e.get_panelsUpdating();
for (var i = 0; i < panels.length; i++) {
var pnl = panels[i];
updatedPanelArray.push({ id: pnl.id, oldHTML: pnl.innerHTML });
}
}
function pageLoad(sender, e) {
if (e.get_isPartialLoad()) {
for (var i = 0; i < updatedPanelArray.length; i++) {
var updatedPanel = updatedPanelArray[i];
var pnl = document.getElementById(updatedPanel.id);
updatedPanel.newHTML = pnl.innerHTML;
pnl.innerHTML = updatedPanel.oldHTML;
setTimeout(refreshUpdatePanel, updateTime - Date.now());
}
}
}
function refreshUpdatePanel() {
for (var i = 0; i < updatedPanelArray.length; i++) {
var updatedPanel = updatedPanelArray[i];
var pnl = document.getElementById(updatedPanel.id);
pnl.innerHTML = updatedPanel.newHTML;
}
}
Sys.WebForms.PageRequestManager.getInstance().add_pageLoading(pageLoading);
</script>
The update time is set before triggering the asynchronous postback:
<asp:UpdatePanel runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label ID="lblUpdatePanel1" runat="server" />
<asp:Button ID="btnUpdatePanel" runat="server" OnClientClick="setUpdateTime();" OnClick="btnUpdatePanel_Click" />
</ContentTemplate>
</asp:UpdatePanel>
It can be tested with the following event handler in code-behind (suggestion: set the delay to 5000 ms in the Javascript code to make it obvious):
protected void btnUpdatePanel_Click(object sender, EventArgs e)
{
lblUpdatePanel1.Text = DateTime.Now.ToString();
}
If you don't mind the user interface being frozen while waiting, you can delay the refresh by keeping the pageLoad event handler busy until the delay expires:
<script type="text/javascript">
var updateTime = 0;
function setUpdateTime() {
updateTime = new Date(Date.now() + 500);
}
function pageLoad(sender, e) {
if (e.get_isPartialLoad()) {
while (Date.now() < updateTime) {
// Loop until the delay expires
}
}
}
</script>
You can initialize the update time before triggering the asynchronous postback:
<asp:UpdatePanel runat="server" UpdateMode="Conditional">
<ContentTemplate>
...
<asp:Button ID="btn1" runat="server" OnClientClick="setUpdateTime();" ... />
</ContentTemplate>
</asp:UpdatePanel>
Use UpdatePanel.UpdateMode Property to gets or sets a value that indicates when an UpdatePanel control's content is updated. For more details visit this link.
You could delay the server side, so all the delays would be more or less equals for everyone.
If this is not an option, you could have a hidden field inside the update panel (or somewhere else). The function that handles the update (in the server side) would calculate the time it took execute, and before finishing, would update this hidden field. Now back in the client side, check the value of this field and calculate the difference between this value and yours 500ms. You could use datetimes or milliseconds.
It's not the prettiest solution but imho, this is not a frequent problem that people want to handle (in fact, I dont think that you should delay a faster response to the slowest one)
I have created a web form in which I have take certain fields like Name, Age and two radio button list (Required and ID). I want to enable disable certain fields on the value of one radiobutton list "Required". The "Required" Radiobuttonlist has two items, "YES", "NO". If I select yes, then certain fields should get enabled disabled and vice versa.
I am able to disable the texboxes, however I am not able to disable a radiobutton list "ID" which has to list items in it as taxId and PAN. I have used the following code for it
function EnableDisableID() {
if (document.getElementById("<%=rdID.ClientID %>") != null) {
var IDList = document.getElementById('<%= rdID.ClientID %>');
var isOpenID;
if (IDList != null) {
var openSubID = IDList.getElementsByTagName("input");
for (var i = 0; i < openSubID.length; i++) {
if (openSubID[i].checked) {
openSubID = openSubID[i].value;
}
}
}
if (openSubID == 'true') {
document.getElementById('<%=fbo1RadioButtonList.ClientID %>').disabled = false;
document.getElementById('<%=txtFbo1TaxId.ClientID %>').disabled = false;
}
if (isOpenSubAccount == 'false') {
alert("Printing..." + isOpenSubAccount);
document.getElementById('<%=fbo1RadioButtonList.ClientID %>').disabled = true;
document.getElementById('<%=txtFbo1TaxId.ClientID %>').disabled = true;
}
}
}
I am able to disable the FBO1TaxId, however, I am not able to disable the radiobutton list "fbo1RadioButtonList". How will I achieve it. do I have to treat its value individually?
I got the answer. I played with my code just a bit and came to a solution below:
function EnableDisableTaxID() {
if (document.getElementById("<%=rdOpeningSubAccount.ClientID %>") != null) {
var openSubAccountList = document.getElementById('<%= rdOpeningSubAccount.ClientID %>');
var rdFbo1TaxId = document.getElementById('<%=fbo1RadioButtonList.ClientID %>');
var rdFBO1Items = rdFbo1TaxId.getElementsByTagName('input');
var isOpenSubAccount;
if (openSubAccountList != null) {
var openSubAccount = openSubAccountList.getElementsByTagName("input");
for (var i = 0; i < openSubAccount.length; i++) {
if (openSubAccount[i].checked) {
isOpenSubAccount = openSubAccount[i].value;
}
}
}
if (isOpenSubAccount == 'true') {
for (var i = 0; i < rdFBO1Items.length; i++) {
rdFBO1Items[i].disabled = false;
}
document.getElementById('<%=txtFbo1TaxId.ClientID %>').disabled = false;
}
if (isOpenSubAccount == 'false') {
for (var i = 0; i < rdFBO1Items.length; i++) {
rdFBO1Items[i].disabled = true;
}
document.getElementById('<%=txtFbo1TaxId.ClientID %>').disabled = true;
}
}
}
You will have to loop over the radio buttons and disable each one. If your buttons are in a form, and you have a reference to the form, then you can use the common name for the buttons to get a collection. Loop over the collection and set each button's disabled property.
If you might either enable or disable the buttons, you can use a condition to set the value, something like:
var rbuttons = form.radioName;
var disabled = true; // disables buttons, set to false to enable
for (var i=0, iLen=rbuttons.length; i<iLen; i++) {
rbuttons[i].disabled = disabled;
}
To enable the buttons, set the disabled variable to false.
Im using Treeview control of System.Web.UI class, to display Category and subcategory of an item.
I have tried the following code but no hope
protected void tvwOrganisation_TreeNodeCheckChanged(object sender, TreeNodeEventArgs e)
{
if (tvwOrganisation.CheckedNodes.Count > 0)
{
// the selected nodes.
foreach (TreeNode node in tvwOrganisation.CheckedNodes)
{
if (node.ChildNodes.Count > 0)
{
foreach (TreeNode childNode in node.ChildNodes)
{
childNode.Checked = true;
}
}
}
}
}
Is there a way I can do this, I have tried javascript too.
Also what is the replace of AfterCheck - windows formd event in web forms.
The tree tag was as follows,
<asp:TreeView ID="tvwRegionCountry" runat="server" ShowCheckBoxes="All" ExpandDepth="0" AfterClientCheck="CheckChildNodes();" PopulateNodesFromClient="true" ShowLines="true" ShowExpandCollapse="true" OnTreeNodeCheckChanged="tvwRegionCountry_TreeNodeCheckChanged"
onclick="OnTreeClick(event)">
</asp:TreeView>
Added following JS as mentioned in asp.net treeview checkbox selection
<script language="javascript" type="text/javascript">
function OnTreeClick(evt) {
var src = window.event != window.undefined ? window.event.srcElement : evt.target;
var isChkBoxClick = (src.tagName.toLowerCase() == "input" && src.type == "checkbox");
if (isChkBoxClick) {
var parentTable = GetParentByTagName("table", src);
var nxtSibling = parentTable.nextSibling;
if (nxtSibling && nxtSibling.nodeType == 1)//check if nxt sibling is not null & is an element node
{
if (nxtSibling.tagName.toLowerCase() == "div") //if node has children
{
//check or uncheck children at all levels
CheckUncheckChildren(parentTable.nextSibling, src.checked);
}
}
//check or uncheck parents at all levels
CheckUncheckParents(src, src.checked);
}
}
function CheckUncheckChildren(childContainer, check) {
var childChkBoxes = childContainer.getElementsByTagName("input");
var childChkBoxCount = childChkBoxes.length;
for (var i = 0; i < childChkBoxCount; i++) {
childChkBoxes[i].checked = check;
}
}
function CheckUncheckParents(srcChild, check) {
var parentDiv = GetParentByTagName("div", srcChild);
var parentNodeTable = parentDiv.previousSibling;
if (parentNodeTable) {
var checkUncheckSwitch;
if (check) //checkbox checked
{
var isAllSiblingsChecked = AreAllSiblingsChecked(srcChild);
if (isAllSiblingsChecked)
checkUncheckSwitch = true;
else
return; //do not need to check parent if any(one or more) child not checked
}
else //checkbox unchecked
{
checkUncheckSwitch = false;
}
var inpElemsInParentTable = parentNodeTable.getElementsByTagName("input");
if (inpElemsInParentTable.length > 0) {
var parentNodeChkBox = inpElemsInParentTable[0];
parentNodeChkBox.checked = checkUncheckSwitch;
//do the same recursively
CheckUncheckParents(parentNodeChkBox, checkUncheckSwitch);
}
}
}
function AreAllSiblingsChecked(chkBox) {
var parentDiv = GetParentByTagName("div", chkBox);
var childCount = parentDiv.childNodes.length;
for (var i = 0; i < childCount; i++) {
if (parentDiv.childNodes[i].nodeType == 1) //check if the child node is an element node
{
if (parentDiv.childNodes[i].tagName.toLowerCase() == "table") {
var prevChkBox = parentDiv.childNodes[i].getElementsByTagName("input")[0];
//if any of sibling nodes are not checked, return false
if (!prevChkBox.checked) {
return false;
}
}
}
}
return true;
}
//utility function to get the container of an element by tagname
function GetParentByTagName(parentTagName, childElementObj) {
var parent = childElementObj.parentNode;
while (parent.tagName.toLowerCase() != parentTagName.toLowerCase()) {
parent = parent.parentNode;
}
return parent;
}
</script>
and it worked...
The TreeNodeCheckChanged event is not firing after the checkbox is checked.
Boolean flag;
protected void TreeView1_TreeNodeCheckChanged(object sender, TreeNodeEventArgs e)
{
Label1.Text = "check event fired";
TreeView1.SelectedNode.Checked = true;
if (flag)
{
foreach (TreeNode child in TreeView1.SelectedNode.ChildNodes)
{
child.Checked = true;
}
}
else
{
TreeView1.SelectedNode.Checked = false;
foreach (TreeNode child in TreeView1.SelectedNode.ChildNodes)
{
child.Checked = false;
}
}
}
After a little research, I found that : It seems to be what you want. :)
The code for the records :
<script language="javascript" type="text/javascript">
function postbackOnCheck()
{
var o = window.event.srcElement;
if (o.tagName == 'INPUT' && o.type == 'checkbox' && o.name != null && o.name.indexOf('CheckBox') > -1)
{ __doPostBack("",""); } }
</script>
<asp:TreeView onclick="postbackOnCheck()" ID="treeContent"
runat="server"> ... And so on ... </TreeView>