ansaurus

Question

Is it possible to do ".value +=" in JQuery ?

Answer 1

+2 A:

I've never come across anything like that, doesn't mean it doesn't exist though.

I usually just store val() in a temporary variable and do the manipulation on that, then call val(temp) in a separate line. It spreads the operation out to three or more lines, but it's still more readable than .val(.val() + ""), IMO. It also scales better than +=, if you have a more complicated expression to do to the value.

var temp = $(".abc").val();
temp += "test";
$(".abc").val(temp);

Sean Nyman 2009-08-03 19:25:32

True, it would look better. I don't worry about scalling since it's a pretty simple function and there is no reason for it to evolve too much.

marcgg 2009-08-03 19:27:19

Answer 2

A:

I think there's no way around it.

.val() returns the element obtained by the $("#abc") selector, so $("#abc").val().add("test") would get the value of the the element and then add "test" to the element.

Of course such a method doesn't exist, but it's to illustrate the fact that doing such a thing is not in phase with the "jQuery philosophy"

Just use variables so your code is more readable.

Guillaume Flandre 2009-08-03 19:27:15

I'm saying .add() as I could have said ".addthistotheendofthestring()", but yeah what you're saying makes sense

marcgg 2009-08-03 19:28:51

Yes, that's what I'm saying, it's 'to illustrate the fact that doing such a thing is not in phase with the "jQuery philosophy"'

Guillaume Flandre 2009-08-03 19:35:06

Answer 3

+9 A:

You could go back to the original DOM element.

 $("#abc").get(0).value += "test";

Otherwise, you'd have to write a plugin

 $.fn.appendVal = function (newPart) {
   return this.each(function(){ $(this).val( $(this).val() + newPart); });
 };

 $("#abc").appendVal("test");

Patrick McElhaney 2009-08-03 19:32:03

Plugin is nice solution, but shouldn't it do return this.each(function(){ $(this).val( $(this).val + newPart); }); --- preserve chain ability and apply to multiple elements if needed?

gnarf 2009-08-03 19:56:37

Thanks for the answer

marcgg 2009-08-03 20:03:02

Yes, gnarf, that's much better. Thanks! I rewrote the plugin using your code.

Patrick McElhaney 2009-08-03 20:08:35

Cool - Deleting my answer then!

gnarf 2009-08-03 20:09:48

one last comment on the plugin... return this.each instead of $(this).each - "this" will be a jquery object already - no need to pass it through the jquery function again.

gnarf 2009-08-03 20:34:32

Answer 4

+1 A:

$() returns a selection; it doesn't return the actual resulting object (although in practice, it simply returns a list of the actual objects). If you want to mutate the object's .value property, you can do this:

$('.abc').each(function(){ this.value += foo; });

If you like, you can create functions that operate on selections, such as .add(), which could be implemented like this:

jQuery.fn.extend({ add: function(k,v) { this[k](this[k]()+v); } });

which can then be used like this:

$('.abc').add('val', foo);

...but I don't think this is any better than using $().each()

geocar 2009-08-03 19:35:42

Answer 5

A:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">

    (function($){
     $.fn.valInc = function(vadd)
     {
      var val = $(this).val() + '' + vadd;
      $(this).val(val);
     }
    })(jQuery);

    $(function(){
     $("#tst").valInc('test 2');
    });

</script>
</head>
<body>
<input id='tst' value="test" />
</body>
</html>

andres descalzo 2009-08-03 19:42:15

ansaurus

tags:

views:

answers:

Is it possible to do ".value +=" in JQuery ?

related questions