CODEWITHSUNDEEP
javascriptjquerytwitter-bootstrapmeteorpagedown
Anders Kitson
Anders Kitson

Reputation: 1545

Trying to get pagedown bootstrap to work on meteor text area

I often have this problem with jquery and meteor, I get a undefined is not a function, and I just cant figure out why.

Here is my code for pagedown-bootstrap package i installed. WRONG LINK this is the right source 

Template.postSubmit.rendered = function () {



$("textarea#pagedownMe").pagedownBootstrap();

};

My html template

<template name="postSubmit">
  <form class="submitForm">

      <label for="date">Date</label>
      <input name="date" type="text" value="" placeholder="Date"/>


      <label for ="title">Title</label>
      <input name ="title" type="text" value="" placeholder="title"/>

      <label for="content">Content</label>
    <textarea id="pagedownMe" name="content"  class="form-control" rows="10">
This is the *first* editor.
------------------------------

Just plain **Markdown**, except that the input is sanitized:

<marquee>I'm the ghost from the past!</marquee>
</textarea>



      <input type="submit" value="Submit" />
  </form>
</template>

The error I am getting

Exception from Deps afterFlush function function: TypeError: undefined is not a function
    at Object.Template.postSubmit.rendered (http://localhost:3000/client/postsPagedown.js?05d5727bffc4120f5b1e1765e9451a7571bbd788:5:26)
    at http://localhost:3000/packages/ui.js?f0696b7e9407b8f11e5838e7e7820e9b6d7fc92f:426:23
    at _assign.flush (http://localhost:3000/packages/deps.js?91f1235baecd83915f7d3a7328526dbba41482be:345:13)

Pacakges from atmosphere

main package pagedown-bootstrap dependant marked

Upvotes: 0

Views: 446

Answers (2)

Anders Kitson
Anders Kitson

Reputation: 1545

I was using the wrong code, I looked at the wrong resource.

JS 

$(function () {
     var converter = new Markdown.Converter();
     var editor = new Markdown.Editor(converter);
     editor.run();

HTML

<div class="wmd-panel">
     <div id="wmd-button-bar">
     </div>
     <textarea class="wmd-input" id="wmd-input">
This is the *first* editor.
------------------------------

Just plain **Markdown**, except that the input is sanitized:

<marquee>I'm the ghost from the past!</marquee>
     </textarea>
</div>
<div id="wmd-preview" class="wmd-panel wmd-preview">
</div>

Upvotes: 0

Tarang
Tarang

Reputation: 75945

It looks like you need to convert the package to work with meteor. The main thing to do is un-variable scope the main variables.

You need to look for files which have variables that are accessed by other variables. Here are two questions that go over the basics of what meteor does and how to get passed it

I would suggest you make it a Meteor package that contains the pagedown package with the variables modified to be global. This way you can namespace the project away from your app and still have it work.

This is a good tutorial on how to make a package: http://www.vintyge.com/blog/2012/12/creating-a-basic-meteorite-smart-package

Sorry about all the links but looking at the package's source it wont be as simple as just copying and pasting it in.

Shortcut but slightly weird way.

You can place the packages files in /client/compatibility. Though you may have to rename the files so they load in the correct order. Meteor loads files alphabetically, so you would have to rename the first file a.js (Markdown.Converter.js - I think) and the next b.js

Upvotes: 1

Related Questions