Trying to append a function with jquery, It didn't append. Why?

Question

I know this is a very basic question but I really find it hard to solve. I can't append this $(".gantt")

$("#gant_chart").append($(".gantt").gantt({

        source: [{
            name:  maintasks_val.task_name,
            desc: "",
            values: [{
                from: "/Date("+maintasks_val.time_start+")/",
            to: "/Date("+maintasks_val.time_end+")/",
            label: maintasks_val.task_name,
            customClass: "ganttRed"
        }],   
}); );

I know there's something wrong in it. I think I cant append like that. Is there any other solution for this?

thanks in advance for those who answers.

You should remove the first `;`, here `}); );`, it just throws an error. [How can I debug my JavaScript code?](http://stackoverflow.com/questions/988363/how-can-i-debug-my-javascript-code) — Ram, Mar 09 '14 at 11:51
@user3302093 : of course there is something wrong with it, which is why it is not working. What are you actually trying to do? where is the html? — T J, Mar 09 '14 at 11:52
You're doing what now? Appending is for DOM nodes, not for functions, does the plugin return the DOM node! — adeneo, Mar 09 '14 at 11:54
@TilwinJoy, I'm trying to append `$(".gantt")` with the resources in it. Because it only prints 2, if I have 5 elements it only gets the last 2 elements. `.gantt` is not a jquery function, it's a plugin. — Vincent815, Mar 09 '14 at 11:57
Does the element with class `.gantt` even exist at this point in the code? Also, the code above will only work if the `.gantt` plugin correctly returns `$(this)`. — Alnitak, Mar 09 '14 at 12:11

Rob Sedgwick · Answer 1 · 2014-03-09T12:23:40.767

1

Try using, say, .each after the append then apply the - .gant

$(".gantt").appendTo($("#gant_chart")).each(function() {

    $(this).gant( ...
    /* apply the '.gant' to 'each' '.gant' that was 'appendedTo' '#gant_chart' */

Update: Another more stepped version for all '.gant' elements, regardless of where they are ( appended ) in the DOM

/* first append */
  var _gants = $(".gant");
  $("#gant_chart").append(_gants);

/* then apply '.gant'  */
   _gants.gant({ ...

You were infact trying to 'append' the function return ( that may not be a node / or jquery object) - thanks to @undefined for clearing some possible confusion here

Update : Using .appendTo() - will return the .gant nodes you want, so you can make use of $(this)

edited Mar 09 '14 at 12:23

answered Mar 09 '14 at 11:57

Rob Sedgwick

5,216
4
20
36

How do you append a function? Do you mean "You were appending the _retuned value_ of the function"?, if the method returns a jQuery object, the only problem here is syntax errors. – Ram Mar 09 '14 at 11:59
@undefined, exactly, makes no sense. OP was attempting to 'append' a function. – Rob Sedgwick Mar 09 '14 at 12:02
Logic **Step 1)** Append all the `.gant` elements into `#gant_chart` - step 2) Then apply the `.gant` to the appended '.gants` - ill update with another way to simplify .. – Rob Sedgwick Mar 09 '14 at 12:08
@undefined, yes too right *if* the `.gant` returned a node, it is fine. But either way - mixing it up like this is just ergghh ( imo ) -1) do the appending, 2) then apply the `.gant` seems the most sensible - and easier to track down the syntax errors. – Rob Sedgwick Mar 09 '14 at 12:18

Trying to append a function with jquery, It didn't append. Why?

1 Answers1