How do I make a panel refresh or load on button click in extjs?
I want to revert all changes in panel color to the default when I click the button go, next, or previous.
There are multiple options :
1. Get the reference to panel and delete it, then Ext.create('panle-class').Place this in place of destroyed panel.
2. Get the reference to panel change its styles to intended ones.
Related
I have an "article" page where the selected article is displayed by default and another articles are ajax-appended to the bottom after clicking on "next" button.
Every article has its own FB share button.
I can reinitialise all the buttons by FB.XFBML.parse(); command, but the existing buttons disappear for a short moment during reinitialisation.
Is there a way to reinitialise only last appended button or somehow to prevent visual disappearing of the buttons?
(Btw. this issue does not apply to twitter button, which can be reinitialised by twttr.widgets.load(); command)
FB.XFBML.parse() function takes a parameter with selected DOM element. Then it will only reinitialise share buttons that are present in the DOM element:
var buttons = newblog.find('.share-buttons')[0];
FB.XFBML.parse(buttons);
I have a shopping cart page which contains 2 tabs.
tab #1 : user can manupulate it's content and rows. add quantity, subtract quantity or even remove the item.
tab #2 : confirm and show all products what user just ordered in tab #1.
now, the problem is, what's jQuery method to 'link' (or bind, or copy. I'm not sure what's the perfect word to describe it.) tab #1 and tab #2, so that when user manipulates data in tab #1, tab #2 will automatically shows it. thank you.
You need to bind first tabs fields change event to a method to retrieve form contents and update the second tabs fields like this:
$('#myFirstTabTextInputId').on('change', function (event){
$('#mySecondTabTextInputId').val($(this).val());
});
this code will copy your first tabs input text to second tab input when it's changed.
I have an option in my page where in I can add new div on button click.
But when ever I add new div the page scrolls back to top, instead of staying focused on new item.
How can i make page stay focused on newly added div??
You can use .focus().docs are here.hope that helps.
As if that button is created using <a href="#"> tag then whenever you click on it due to href="#" it will automatically go to top of the page.
So you need to give either "ID" of that new appended DIV or "javascript:;".
If you passed ID of the DIV then that DIV focused and if you given "javascript:;" then that page will be there only it will perform the action whatever the action function written on click of it.
OR
If that DIV is loading after some service call then you need to handle it through JS you can use event.stopPropagation() function.
If that button is simple <button> element then add an attribute "type" as <button typr="button"> default type is submit so some times its perform some action if that button is included in some <form>
I am assuming the scenario because that Js Fiddle link is not accesible.
Hope it will helps.
After clicking on Delete button in Kendo UI Grid row is disappear, but without clicking save row will not delete.
But with disappeared row users forgets to press save.
Now I want to make it be visible but with opacity.
Added code to .KendoGrid({...:
remove: function(e) {
e.preventDefault();
e.row.show();
e.row.animate({opacity:0.3},800);
}
But prevendDefault in this code acts on save button to, and it doesn't work.
How can I leave row visible after pressing Delete button OR delete row direct on button clicking without save?
I assume your grid's datasource is configured in batch mode; hence, the reason there is a save button? Well, if you want the item to be deleted immediately without the user having to remember to click save, set batch: false on the grid's datasource.
I used dijit/MenuItem in a popup menu for the JS Canvas object. When user right click the Canvas, I want to show the menu and disable some items based on the location that user selected. Hence, I code in the onmousedonw event of the Canvas to disable the item.
Everything works fine except that when I right click and the menuitem change from enabled to disabled, the item in the menu is still showing as normal state until I move mouse over it and then it shows gray as disabled. Is there a way that I can somehow "refresh" the menuitem after changing the disabled state so that it will be shown as grayed out immediately when the menu show?
HTML for the menu
<ul dojoType="dijit/Menu" id="menu" style="display: none;border-radius:3px;">
<div dojoType="dijit/MenuItem" id="Popup_Cut"><span>Cut</span></div></ul>
JS for the disable
function handleMouseDown(event) {
if(...)
dijit.byId("Popup_Cut").disabled = true;
}
Instead of using the property disabled, use the set method instead:
dijit.byId('Popup_Cut').set("disabled",true);
Had the same problem, and this worked for me.
More info on set:
http://dojotoolkit.org/reference-guide/1.8/dijit/info.html#set-and-get