Stay on same tab after postback - javascript

I am using Samson O's very nice Easy Responsive Tabs to Accordion plugin on an ASP.NET page. On Tab 2 I have a Search button that when clicked executes some code in a code-behind and returns the search results to the page. Everything works except that the page goes back to the first tab when it's finished running the code in the code-behind. I want it to stay on Tab 2. How can I achieve this?
I have tried calling a JavaScript function to simulate the click of Tab 2 ($('#mycharities').click();) from the OnClientClick event of the Search button and also as the last thing on the Search button click event in the code-behind. Both options run the JavaScript but the page still goes back to the first tab once finished.

Answer to your question lies in the script for this plugin :
//Active correct tab
$($respTabs.find('.resp-tab-item.' + options.tabidentify)[tabNum]).addClass('resp-tab- active').css({
'background-color': options.activetab_bg,
'border-color': options.active_border_color
});
If you notice it takes [tabNum] to set the active tab. So you need to figure out the last selected tab num and in your custom javascript function that you need to set the appropiate css class to that tab. Then u will have it selected after the postback.
Best yet try to submit using AJax. It easy and you can avoid hassles.

Related

How to detect save and tab change event using angular8 with bootstrap4

i have used bootstrap4 tabs in angular8. Now if i have not filled details in first tab, (i.e) user tab and click on submit, then the other tab must be disabled, once the submit button is click then the other tab must be enabled.
Here based on click of other tab, the contents in the other tab must be loaded, if other tab is not clicked, then the details in others tab must not be filled. I have tried by using click event and tabChange event, but everything works in app.component but the data doesnt come to the user or other tab based on click on other tab.
I am not getting anyway to move forward, i have even used event emitters and storage inside the app, through service files, but nothing worked for me.
Demo
I looked at your Demo and I think I understand your problem. I personally am a fan of using ReplaySubjects, and EventEmitters to pass data up and down through my components. Here is a working demo : Working Demo
Let me know if it is not what you were looking for.

Keep scroll position in ADF page

I have a page with few forms in it and a submit button to save the records. If there is any errors then I m displaying the error messages programmatically in faces message .
But after clicking on the ok button on the af message, the page scrolls to the top and I have to scroll down again to click the button.
Is there any way to save the scroll position in ADF . I tried to call Java script
Window.scrollto () method
But for other methods it's working fine but not after clicking on the af message ok button.
Please let me know any way to scroll down to the bottom of the page.
markosca already gave the correct hints as a comment.
I'll clarify a bit on this for the sake of a complete answer:
If your buttons trigger an action, always a complete new site will be loaded.
Even if the "new" site is equal to the old one, it will seem as if the site has scrolled up.
If your buttons have an actionListener registered, this scrolling will also happen. Even if you put an addPartialTarget(...) inside that registered Java-method.
So, how to solve this? It's easy, just use an actionListener and the attribute partialSubmit="true" on the button or link.
Only than a partial submit will be executed instead of a full page reload.
And don't forget to either use addPartialTarget(...) in Java or the attribute partialTriggers="..." on the components which should update because of that partial submit.

Browser doesn't execute javascript when I move back

I have a script that toggles checkbox when page is loaded (by default it's unchecked).
Example:
if (bla bla bla) {
$('#test').trigger('click');
}
It works as expected, but if I go forward to the next page and then go back again (or restore closed tab with that page), this doesn't work: the checkbox remains unchecked. I guess in this case browser doesn't execute js.
Is there any solution to resolve this issue? Thanks.
When you go back, (most browsers) reload the form as it was when you left the page, and then toggle the checkbox.
The best solution here might be to set the checkbox to checked rather than toggling it.
$('#test').prop('checked', true);

SharePoint <button> elements perform an unwanted reload of the page

I have an aspx page on my SharePoint site, which I have included tags. For some reason, every button on the page will reload the page when clicked. Even the buttons with no attributes (id, class, etc) or functions will reload the page when clicked. How can I fix this issue? I can't even see what's going on in the debugger because I'm not calling any reload functions, so I have no idea where to place a breakpoint.
Thank you in advance for your help, I really appreciate it.
The problem here is with the <button> tag. Its default behavior is to act as a submit button unless otherwise declared and will reload.
To keep your <button> tag, add type='button' to the button element. I think that prevents the reload.
Or you could go with the ole <input> tag with a type='button'. That keeps the reload from happening as well.
Or some other html element with an onclick event will work too.
First search for a function called doPostback and set a breakpoint on the entry point and click a button. If you hit this breakpoint it could mean that auto post back is turned on for the control generating the button. However if you trigger that breakpoint you should be able to look at the stack trace to figure out how you got there.
If that doesn't work, use the F12 tools in the browser, start with the HTML section and search (Ctrl-F) for the word "click". Then go to the script tab and do the same for each JavaScript file. If all of the buttons exhibit the behavior there is most likely a click event registered. Possibly with jQuery that looks like this $('button') so that it matches all buttons on the page and registers a click handler.
If that doesn't find it, and you have access download one of the master pages from http://startermasterpages.codeplex.com/ and temporarily replace your master page with one of these. Take a screenshot of the scripts that are loading on your page first. Then add them to the starter master page one at a time until the unwanted behavior returns. Then set a breakpoint on every function entry point in that script and click a button and see where you land.

Wysiwyg Tiny MCE, problem adding custom links

I am trying to see witch one i like best, Tiny MCE or CKEditor. The problem that i am getting is that i need to add a custom toolbar button (or extend the anchor button). Trying now to modify the advlink plugin to insert internal links from the CMS. So i modified the page link.htm and added one button next to the href field. This button opens up a small popup where the user can select an internal link in the CMS and then press insert. The small popup then uses javascript to send the result back to the link.htm page. The link is then inserted into the href field. My problem is that when i press insert on the link.htm page, it just reloads the page and nothing is inserted.
This is the javascript that i added to the link.htm page:
function ShowInternalLinks() {
window.open('InternalLink.aspx', 'InternalLink', 'toolbar=0,status=0,menubar=0,location=0,directories=0,resizable=0,scrollbar=0,width=400,height=200');
}
function InsertInternalLink(link) {
document.getElementById('href').value = '/1/?' + link;
}
Nothing fancy, just opens up my custom aspx page when the ShowInternalLink is clicked. Then when the user clicks on insert on that page, the page calls the javascript InsertInternalLink and then closes the small popup. Everything works when i run the page, the href gets the correct value from the popup page, but when i then press insert, the page just reloads and the href field resets itself.
Any ideas? (If i write in the URL in the href field, it works perfectly. Just doesn't work when i use my popup window)
Side question: Can this even be done easily in CKEditor?
The href field has an onchange listener that performs the following: selectByValue(this.form,'linklisthref',this.value);
Can you debug and see if this is being called. I'm thinking that it isn't, and this might be your problem.

Categories