Rank 1
Hi,
There is something similar like undo button or revert button which can restore the last value from an input field, something similar like undo from kendo editor?
I'v seen an example here:https://docs.telerik.com/kendo-ui/controls/diagrams-and-maps/diagram/how-to/modify-undo-redo-stack.
Best regards,
Alex
9 Answers, 1 is accepted
Thank you for contacting us. Could you please provide some details, do you have a specific widget in mind when referencing such undo / revert button? Even if the widget does not provide such functionality out-of-the-box, it may be still possible to provide it with some custom code (for example, add an undo button of your own, and use the .value() method of input-type widgets to re-set the original value from the model that you can store somewhere so you can revert to it).
I am looking forward to your reply.
Regards,
Martin
Progress Telerik
Rank 1
Hello Martin,
Thank you for the answer and I am deeply sorry for my late reply.
I did something similar that you suggested me and here is it.
<body>
<form>
<input id="lastname">
<button type="button" id="aiResetButton">
Reset
</button>
</form>
<script>
$(document).ready(
function() {
var oldValue = [' '];
var counter = 1;
$('#lastname').kendoButton().change(function() {
if (counter === 0) {
oldValue[counter] = '';
} else {
oldValue[counter] = this.value;
}
console.log('Old value became: ' + oldValue[counter]);
counter++;
});
$('#aiResetButton').click(
function() {
if (counter == 0) {
// disable here the button
}
console.log('Current value is:---->'
+ $('#lastname').val() + '<----changing to ->'
+ oldValue[counter - 1]);
$('#lastname').val(oldValue[counter - 1]);
counter--;
});
});
</script>
</body>
Hello Alexandru,
Thank you for the provided code. I created a small Dojo example based on it. Is the functionality demonstrated in it the desired result? As far as I understand, you wish to save the last value of the input field, and restore it when you click a button. Having that said, could you please provide some information why are you initializing a KendoButton from an input element?
Could you also provide some information about the scenario? Are you using any of the Kendo input-type widgets (like the Autocomplete, Dropdownlist, etc)? If that is the case, please explain the functionality you wish to achieve and I will be happy to assist you. Feel free to modify the example if necessary.
Regards,
Martin
Progress Telerik
Rank 1
Hello Martin,
Thank you for replying. I got a mistake on javaScript code which I sent to you. I shouldn't initializing kendoButton on input element. It should be a normal kendo textbox.
I modified my mistake.
$(document).ready(
function() {
var oldValue = [' '];
var counter = 1;
$('#lastname').kendoAutoComplete().change(function() {
if (counter === 0) {
oldValue[counter] = '';
} else {
oldValue[counter] = this.value;
}
console.log('Old value became: ' + oldValue[counter]);
counter++;
});
$('#aiResetButton').kendoButton().click(
function() {
if (counter == 0) {
// disable here the button
}
console.log('Current value is:---->'
+ $('#lastname').val() + '<----changing to ->'
+ oldValue[counter - 1]);
$('#lastname').val(oldValue[counter - 1]);
counter--;
});
});
I am using at the moment kendo textbox. To be precise I create a PHP class for that, but I found no specific class for textbox so I borrow masked textbox.
Now my problem is I have no clue at the moment to use the reset button for one or more dropdownlist.
Hi Alexandru - Paul,
This Dojo example demonstrates how we can reset the value of the AutoComplete component with the previously selected item. To achieve the desired functionality the AutoComplete's change event is used. The code that stores the previous element data and that is executed on the mentioned change event is:
if(prevValue.length==0){
prevValue[0] = autocomplete.data("kendoAutoComplete").value();
prevValue[1] = autocomplete.data("kendoAutoComplete").value();
}
prevValue[0] = prevValue[1];
prevValue[1] = autocomplete.data("kendoAutoComplete").value();
$("#prevValueHolder").text(prevValue[0]);Please check the linked Dojo and let me know if the provided solution resolves your issue or if you need further assistance with the current case.
Regards,
Petar
Progress Telerik
Rank 1
Hi Petar,
Thank you for replying and I am deeply sorry for my late answer.
I took your example and I tried to make for input textbox.
Also I want to disable or enable reset button which depends of length of value.
I have a question. Is that possible to have multiple fields such as (dropdown, inputs) using your example?
Thank you!
Regards,
Alexandru-Paul
Hi Alexandru-Paul,
There is no need to excuse for the timing of the reply.
The way the Button component is used in the provided Dojo example is not the correct one. Using code like this one:
var resetButton = $("#resetButton").kendoButton({
enable: true
}).data("kendoButton");initializes anew Button component with each execution. The proper way is to define the above definition once, initialize a button and after that use the enable method of the component.
Here is an edited version of the Dojo you sent me that demonstrates how we can enable/disable a button using the mentioned method. Based on the logic you want to implement, you can use the demonstrated approach to enable/disable the button.
Regarding your question "Is that possible to have multiple fields such as (dropdown, inputs) using your example?" I am not sure what you want to achieve. Can you give more details about the targeted functionality?
Looking forward to your reply.
Regards,
Petar
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.
Rank 1
Hi Petar,
Thank you for your replying and also for sharing me the way the button component is used.
Regarding my question about multiple inputs and dropdownlist, I would like to be able to reset the value for each individual field.
I thought of adding an oldvalue for each input and dropdown so I could store the value for each field.
Thank you!
Regards,
Alexandru-Paul
Hi Alexandru-Paul,
You can use the approach from the Dojo projects I've provided in my previous replies and store the previous values of each form item in separate variables that will be then loaded back in the inputs.
In the Dojo you've sent me, to prevent the form submission when the "Reset" button is pressed, we have to define the type of the button element. This can be done using the following code:
<button id="reset" type="button" class="k-button" onclick="onClick()">Reset</button>If you add the marked in yellow code, the form won't be submitted when the "Reset" is clicked. Then on click, you can load the store values back in the form inputs. Here is a Dojo demonstrating the usage of the above snippet.
Regards,
Petar
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.