rubentd / dirrty Goto Github PK
View Code? Open in Web Editor NEWjquery plugin to detect if the fields of a form had been modified
Home Page: rubentd.com/dirrty
License: MIT License
jquery plugin to detect if the fields of a form had been modified
Home Page: rubentd.com/dirrty
License: MIT License
Please, create a new tag to fix -> $('form').dirrty('setClean');
A current version is outdated
Anyone have use it with x-editable or similar plugin?
https://vitalets.github.io/x-editable/
I'm wondering what is the best approach to use dirrty for this kind of form...
Is there any way to ignore the click of specific button so it's not sending an alert?
For example I have a form within this form I have a button that open a popup to add item to the list
and I don't want the user get notified if he click on that button
Also having an ignore class for a specific field can be usefull
The data-is-dirrty value of Field select2 multiple is always true.
The solution I found to resolve
`
checkValues: function(){
var d = this;
this.form.find("input, select, textarea").each( function(){
var initialValue = $(this).attr("data-dirrty-initial-value");
if($(this).val() != initialValue){
$(this).attr("data-is-dirrty", "true");
}else{
$(this).attr("data-is-dirrty", "false");
}
});
this.form.find("input[type=checkbox], input[type=radio]").each( function(){
var initialValue = $(this).attr("data-dirrty-initial-value");
if($(this).is(":checked") && initialValue != "checked"
|| !$(this).is(":checked") && initialValue == "checked"){
$(this).attr("data-is-dirrty", "true");
}else{
$(this).attr("data-is-dirrty", "false");
}
});
this.form.find("input[type=search]").each( function(){
$(this).attr("data-is-dirrty", "false");
});
var isDirty = false;
this.form.find("input, select, textarea").each( function(){
if( $(this).attr("data-is-dirrty") == "true" ){
isDirty = true;
}
});
if(isDirty){
d.setDirty();
}else{
d.setClean();
}
d.fireEvents();
},`
I have a textarea filled and cleared by the click of a button.
These cases where ignored by dirrty.
To fix the problem I'm adding .trigger('keyup')
original
$('#clear').on('click', function() {
$("#mytextareaid").val('');
});
fixed
$('#clear').on('click', function() {
$("#mytextareaid").val('').trigger('keyup');
});
I'm looking for a way to ignore a specific field to get dirrty.
Hi,
I need to translate the alert dialog message.
Where are they set?
I only find a message inside the JS which is not corresponding
You have unsaved changes
VS what it is displayed
Do you want to leave this site.
Changes you made may not be saved.
Leave Stay (buttons)
Here is my actual code
$("#edit").dirrty().on("dirty", function(){
$("#save").removeAttr("disabled");
}).on("clean", function(){
$("#save").attr("disabled", "disabled");
});
Thanks
I have list of elements in the forms. When I listen the on dirty, can I get the current input element which got dirty.
I had an issue with fields being marked as dirty merely by focusing them. Not sure whether this is context dependent, but I'm using Bootstrap 3.
In the checkValues function, I fixed this by checking for initialValue being defined or not. If the field is clean, initialValue will have the value "undefined", hence triggering the field as dirty in the comparison
if($(this).val() != initialValue)
Checking for initialValue being undefined fixes this problem:
if($(this).val() != initialValue && typeof initialValue != "undefined")
I looked at the source and there is a setClean function but I can't figure out how to call it. I tried to
Hi,
I'm using this datepicker https://github.com/uxsolutions/bootstrap-datepicker
If I enable the clear button setting clearBtn: true,
this is not triggering a change when I clear the value and not enabling the save button
How to reproduce:
have a chained dropdowns using Select2
have the option allowClear: true,
and .select2-single
Let say country, state, city
on page load no value selected
select a country, click on the clear
Now State and City are marked as dirrty, Country is marked as clear
the 3 fields should be marked as clean
Is dirrty.js will work with input type file?
I'm using jquery.filer.js
the <input type="file" name="files[]">
once I have upload a file and remove the file it still getting data-is-dirrty="true"
Here is a demo of jquery.filer as the project is no longer available on Github... https://www.tutorialspoint.com/jquery/src/filer/index.htm
Thanks
I'm having 2 differents forms on tabs (bootstrap tabs)
tab1 = form1
tab2 = form2
Let say a user made a change on tab1 form and click on a tab2, I want to detect this even as a quit before saving.
What will be the best way to do it?
Let say I have two forms on the same page with different ids for the form and the submit
I edited both forms so they have both dirtty fields
If I click one of the submit button I will get beforeunload notification.
Any way to fix that?
Note:
I have redo my page and now it's working fine I'll close this for now as I don't know how to reproduce.
I have form where a user can add more input elements. In the background i clone the input element and change id, name and value on the cloned input element.
After cloning i need to recall dirrty on the form to take into account the cloned input element. Problem is when another field was changed before the user clicks the add button, then i get unexepected results from isDirrty.
How would i add the cloned input elements to diirty? Only changing the data-dirrty-initial-value and data-is-dirrty attribute isn't enough.
I made several tests and still have issue so I guess we need a clean function for this
I want this plugin to monitor if my form is dirty, but just submit the changed fields to the server.
How can I do this?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.