I am getting the error at the line :
validate();
When I trying to call the following jQuery function
(function ($) {
"use strict";
var methods = {
validate: function () {
if ($(this).is("form"))
return methods._validateFields(this);
else {
// field validation
var form = $(this).closest('form');
var options = form.data('jqv');
var r = methods._validateField($(this), options);
if (options.onSuccess && options.InvalidFields.length == 0)
options.onSuccess();
else if (options.onFailure && options.InvalidFields.length > 0)
options.onFailure();
return r;
}
}
}
Using the following JavaScript, I am getting the error at validation function.
<script type="text/javascript">
function dateSelectionChanged(sender, args) {
$(function () {
validate();
});
}
</script>
The function validate has been described in the above jQuery.
Try this:
var methods = {
validate: function () {
if ($(this).is("form"))
return methods._validateFields(this);
else {
// field validation
var form = $(this).closest('form');
var options = form.data('jqv');
var r = methods._validateField($(this), options);
if (options.onSuccess && options.InvalidFields.length == 0)
options.onSuccess();
else if (options.onFailure && options.InvalidFields.length > 0)
options.onFailure();
return r;
}
}
<script type="text/javascript">
function dateSelectionChanged(sender, args) {
methods.validate();
}
</script>
You need to expose methods to other functions - put it in the global scope.
So either use the global window object and do:
window.methods =
For example:
(function ($) {
"use strict";
window.methods = {
validate: function () {...
Or define it first outside of (function($){...})
For example:
var methods = {};
(function ($) {
"use strict";
methods = {
validate: function () {...
Notice no var before second methods.
Then you can call methods.validate()
Also: ensure you close (function ($) { with })(jQuery) - it's missing from the code that you posted.
I have fixed it !!
I have called jQuery("#aspnetForm").valid();
I Have created a function called valid()
Like this :
$.fn.valid = function (method) {
methods._validateFields(this);
};
Now its fine .... !
Related
I have this custom component
(function ($) {
$.fn.stuff = function (options) {
var myStuff = this;
myStuff.render_item = function () {
// Do something
return "default result";
};
myStuff.test = function () {
myStuff.render_item;
};
return myStuff;
};
}(jQuery));
I want to "extend" this component and re-declare the "render_item" fonction without editing the file directly since it's from a library.
How can I achieve this ?
Thank you.
You can monkey-patch it like this:
(function($) {
$.fn.old_stuff = $.fn.stuff;
$.fn.stuff = function(options) {
var myStuff = $(this).old_stuff(options);
myStuff.old_render_item = myStuff.render_item;
myStuff.render_item = function() {
// do something
myStuff.old_render_item();
// do something else
};
return myStuff;
};
}(jQuery));
var Rules = Rules || (function () {
saverule = function () {
var level = document.getElementById("level-selection");
var metrics = document.getElementById("metric-selection");
var operator = document.getElementById("operator-selection");
var value = document.getElementById("value123");
var saveAction = $("#hidden-save").val();
$.post(saveAction, { level_id: level, product_id: metrics, opp: operator, value: value }, function () {
},
'json');
};
wireLinkActions = function () {
$("a.save-ok").on("click", function(event) {
saverule();
return false;
});
};
return {
Initialize: function () {
wireLinkActions();
}
}
})();
$(document).ready(Rules.Initialize);
illegal invocation error it wont even cal the the save rule function while debugging also
Make sure your return the values and not the DOM element itself.
For example change this:
var level = document.getElementById("level-selection");
into this:
var level = document.getElementById("level-selection").value;
or, simply use jQuery such as this:
var level = $("#level-selection").val();
I'm building a simple calculator to incorporate it in a simple web based POS system. I do not have much experience with JS but i have programmed in C, C++ & Java extensively.
In the firefox debugger I get an exception TypeError: "this.getValue is not a function." when it is called in the method updateDisplay().
It this kind of structure not supported in JS? Calling object methods in a method of an object?
http://jsfiddle.net/uPaLS/33/
function KeyPad(divReference) {
this.divDisplay = divReference;
this.value = "0";
this.comma = false;
}
KeyPad.prototype.getValue = function () {
return parseFloat(this.value);
};
KeyPad.prototype.updateDisplay = function () {
$(document).ready(function () {
$(this.divDisplay).text(this.getValue());
});
};
KeyPad.prototype.keyPressed = function (valueString) {
if (valueString == '.' && this.comma === true) {
return;
}
this.value = this.value + valueString;
if (valueString == '.') {
this.comma = true;
}
this.updateDisplay();
};
KeyPad.prototype.reset = function () {
this.value = "0";
this.comma = false;
this.updateDisplay();
};
var keyPad = new KeyPad("#keypad_display");
In your function updateDisplay , this doesn't refer to your KeyPad object: it refers to $(document), because you're not in the same scope of how the function is called.
KeyPad.prototype.updateDisplay = function () {
//'this' is Keypad
$(document).ready(function () {
//'this' is $(document)
$(this.divDisplay).text(this.getValue());
});
};
I don't think (maybe i'm wrong) that using $(document).ready here, inside a function, is a good practice. This should simply fixed your error:
KeyPad.prototype.updateDisplay = function () {
$(this.divDisplay).text(this.getValue());
};
As sroes says in the comment, you should use the $(document).ready like this:
$(document).ready(function () {
var keyPad = new KeyPad("#keypad_display");
});
I have a function to find highest value in an XML file from certain tag which has to assign one of default value in plugin. My problem is my plugin code runs before the other function hence a null value is returned. Can I run function get_Highest_Property_Prise() before plugin, like java constructor? Or some how initialize a global variable before plugin code kicks in?
var pulgin_Global_Variables = {
hight_price: ""
};
(function($) {
$.fn.SearchProperty = function (options) {
var defaults = {
S_MinPrice: 0,
S_MaxPrice: get_Highest_Property_Prise()
};
alert("yo yo "+defaults.S_MaxPrice);
}
})(jQuery);
function get_Highest_Property_Prise()
{
$.get('Data.xml', function (XML_property) {
$(XML_property).find('property').each(function () {
var c_Price = parseInt($(this).find('priceask').text().replace(',', ''));
if (c_Price > pulgin_Global_Variables.hight_price) {
pulgin_Global_Variables.hight_price = c_Price;
}
}); //end of function
});
}
var pulgin_Global_Variables = {
hight_price: ""
};
$.fn.SearchProperty = function (options) {
var defaults = {
S_MinPrice: 0,
S_MaxPrice: pulgin_Global_Variables.hight_price
};
alert("yo yo "+defaults.S_MaxPrice);
}
})(jQuery);
//here set max price to match your global object
$.get('Data.xml', function (XML_property) {
$(XML_property).find('property').each(function () {
var c_Price = parseInt($(this).find('priceask').text().replace(',', ''));
if (c_Price > pulgin_Global_Variables.hight_price) {
pulgin_Global_Variables.hight_price = c_Price;
}
}); //end of function
}).done(function () {
$(whatever).SearchProperty()
})
I want to test this function:
/js/lib/front.js
var Front = function(){
this.onSignUp = function(){
if (!Form.assertInput("email")) {
$("input[name=email]").focus();
this.showHiddenMessage("Email not set.");
return false;
}
}
}
I have in:
/js/lib/form.js
function Form() {
this.assertInput = function (name, defaultValue) {
var text = $("input[name=" + name + "]").val();
if (defaultValue != null) {
if (defaultValue && text == defaultValue)
return false;
}
if(this.trim(text)) return true;
return false;
}
}
This simple test passing:
test("Front", function() {
var front = new Front()
ok(front);
});
But if I write something like this:
test("On Sign Up ", function() {
var front = new Front()
equal(front.onSignUp(),false,"passing test");
});
I have error:
Died on test #1: Form.assertInput is not a function
I don't understand, what I need test in function like this and how include function inside another function?
I've saved a working fiddle here. As a side note, you might want to check out a tutorial on using qUnit, here.One thing that you need to pay attention to is when you're declaring your functions. It's saying Form.assertInput is not a function because you can't access it like that. You need to use the this keyword, which refers to current context. The code should be something like this:
var Form = function () {
//good to have assertInput first if you're using it in a later function
this.assertInput = function (name, defaultValue) {
var text = $("input[name=" + name + "]").val();
if (defaultValue != null) {
//safer to explicitly close your if statements with {}
if (defaultValue && text == defaultValue) {
return false;
}
}
if ($.trim(text)) { return true; }
return false;
};
this.showHiddenMessage = function (message) {
alert(message);
};
this.onSignUp = function() {
//this will point to the current context, in this case it will be Form class
if (!this.assertInput("email")) {
$("input[name=email]").focus();
this.showHiddenMessage("Email not set.");
return false;
}
};
};
Also in the example code that you gave you're missing the Front class. So I created a dummy one in my fiddle like this:
var Front = function() {};
Here are the tests that were run:
$(document).ready(function() {
test("Front", function() {
var front = new Front();
ok(front);
});
test("On Sign Up ", function() {
var form = new Form();
equal(form.onSignUp(), false, "passing test");
});
});