Set property of a span in javascript

Question

I would like to set the width of a span, I succeded in getting the right element. I already tried :

$(".k-widget .k-numerictextbox")[0].style.width=60;
//the next one gives VM37616:1 Uncaught TypeError: $(...)
//[0].style.setAttribute is not a function
$(".k-widget .k-numerictextbox")[0].setAttribute('width', '60');
$(".k-widget .k-numerictextbox")[0].style.setAttribute('width', '60');

In the console :

$(".k-widget .k-numerictextbox")[0].style.width

Shows me this but I would like to set it to 60px:

""

In fact I am iterating and my last iteration set a numeric textbox which seems to reset my width :

 $.each(grid.wrapper.find("[class=k-filter-row]"), function (index, elt) {
    $.each(grid.wrapper.find("[data-field=Id]"), function (index, elt) {
        $(".k-widget .k-numerictextbox")[0].style.width = "60px";//works
        $.each(grid.wrapper.find("[data-role=numerictextbox]"), function (index, elt) {
            console.log($(this));
          //will undo my changes
            $(this).kendoNumericTextBox({
                culture: "fr-FR",
                format: "#",
                decimals: 0,
                min: 0,
                width:60,
                step: 1

            });
        });
     });
});

Any help ?

UPDATE : The coe I gave work but I did'nt put my full problem: I am iterating in a $.each where after I declare a numericTextbox which reset my width ! See below — Benoît, Aug 30 '17 at 16:25

score 0 · Answer 1 · answered Aug 30 '17 at 16:22

0

first you need to check if you have the correct jq selector and try this:

$(".k-widget .k-numerictextbox").width(60);

answered Aug 30 '17 at 16:22

Hajji Tarik

1,072
7
23

It didn't work, I found by debbugging that it is due to my iteration, check my updated question – Benoît Aug 30 '17 at 16:29

score 0 · Answer 2 · answered Aug 30 '17 at 16:23

0

If you are using jQuery, as you seem to be, then

$(".k-widget .k-numerictextbox").width(60);

should do the trick.

http://api.jquery.com/width/

answered Aug 30 '17 at 16:23

Ibraheem Rodrigues

21
8

It didn't work, I found by debbugging that it is due to my iteration, check my updated question – Benoît Aug 30 '17 at 16:29

score 0 · Accepted Answer · answered Aug 30 '17 at 16:39

Very simple solution : I set my width AFTER.

$.each(grid.wrapper.find("[class=k-filter-row]"), function (index, elt) {
    $.each(grid.wrapper.find("[data-field=Id]"), function (index, elt) {
        $.each(grid.wrapper.find("[data-role=numerictextbox]"), function (index, elt) {
            console.log($(this));
            $(this).kendoNumericTextBox({
                culture: "fr-FR",
                format: "#",
                decimals: 0,
                min: 0,
                step: 1

            });
            $(".k-widget .k-numerictextbox")[0].style.width = "60px";
        });
     });
});

Set property of a span in javascript

3 Answers3