TinyMCE get form content without using submit button - forms

I'm trying to put TinyMCE on my website. I figured out how to get it to show up, but I'm lost on how to process the content. In their example, they just have a link that references the top of the page and clicking on it somehow magically causes their dump.php script to execute. I don't understand what's going on here. Here is the link:
http://www.tinymce.com/tryit/basic.php
The "Submit" button at the bottom is really a link in a span element with href="#". The form action is dump.php. I want to know how they configured this to run without an actual submit button. Any help in understanding this is greatly appreciated!

To Get Content From Tinymce You Can Use GetContent Method of Currently ActiveEditor Instance
tinyMCE.activeEditor.getContent();
method is used to getting Content .. to Set The Content
tinyMCE.activeEditor.setContent("I Want Text To Be in Tinymce");
to find a perticular element in tinymce get body and find element
var body = tinyMCE.activeEditor.getBody();
$(body).find("#elem_id")
to get a full html
tinyMCE.activeEditor.getDoc().documentElement.innerHTML
hope that helps ..

Since I use PHP, I found this which is also useful:
http://www.tinymce.com/wiki.php/TinyMCE3x:How-to_implement_TinyMCE_in_PHP

Related

File Upload not working after moving form field

I have a large form with a image upload field working ok.
Field is defined in model as:
$this->add('filestore/Field_Image','thumbnail_id');
Then I created two tabs inside form:
$tabs=$form->add('Tabs');
$main=$tabs->addTab('General');
$design=$tabs->addTab('Design');
And moved image field to design tab:
$design->add($form->getElement('thumbnail_id'));
Now I can't upload files. When I try I get the following javascript error
Error: cannot call methods on atk4_form prior to initialization; attempted to call method 'submitPlain
Is there any other way to move the field or have upload working again after moving it?
I was trying to use the same method ($design->add($form->getElement('my_element'));) to move a slider into another place on the page. That didn't work - I think it was because the slider input field is not placed on the page the same way as other input fields.
So I tried with the jQuery appendTo-method (I found the hint in a comment from romanish in a documentation page). That worked. But then I experienced the same problem as you - and in the end I gave up and solved the problem by editing the slider-class page.
So I can't help you, sorry, but I guess this points out that there is a general problem related to getting input from moved form elements.

Preventing page jump - hashed anchor tag - default behavior

I made a type of menu box with css click events using targets and link them with hash anchor tags. The problem is, when I click one of the buttons (One, Twii, Thrii, etc.) the page jumps! I tried using a js script to stop the default behavior but to no luck. Could you please help me stop the page jump so the page does not move when a button/link is clicked!
Heres the JS Fiddle link I made. jsfiddle.net/3ASpX/1/
I need a solution..whether its with using target or something else!
Thank You and I apoligize for any confusion in explanation and the question itself if I have done something wrong, your help is much much much appreciated.
I think you could do this by using <div> instead of <a>.
But if you have to use an <a>, you could remove the target with jQuery:
$( '.link' ).removeAttr("href");

"Send" button popup not appearing correctly

I'm using the Facebook Like/Send buttons along with dynamically generated HTML (loaded via AJAX requests). I've found that even though the Send button works fine when the element exists on page load, dynamically created Send buttons aren't working correctly. Clicking the button activates it and the button greys out, but the popup doesn't appear.
Here is a demonstration of what is happening: http://jsfiddle.net/Daniel15/VxpSj/
Any suggestions?
Thanks!
Yes, I can confirm the problem from your fiddle.
function addLikeButton()
{
// […]
FB.XFBML.parse(newEl);
document.getElementById('container').appendChild(newEl);
}
For some reason, this seems to be “the wrong way around”. Reverse the order of these two lines – put the new element into the DOM first and let FB.XFBML.parse parse it afterwards, then (from my test with your fiddle) it seems to work in the desired way.

jQuery Show/Hide divs using same class not working because of html.push?

The object is to Show-Hide text located under their respective Titles, so a User reads the title and shows or hides text belonging to that title if the User wants to read more.
I tried whatever I could find so far on here, we're talking dynamically setting text coming from a spreadsheet, can't use IDs, must work with .class, must be missing something, I have this piece of code:
... html.push('<div class="comments">' + comment + '</div></div></div>');
but when I try this Show-Hide code nothing happens, even if the error console shows nothing. Basically I want to Show-Hide the .comments class divs with a show-hide toggle link located under each of them. I say them because the .comments divs are reproduced dynamically while extracting text coming from Google spreadsheet cells/row (one .comments div per spreadsheet row). I tried .next, child and parent but they all divorced me so I dunno looks like a dynamic issue. So far I only managed to globally toggle all divs to a visible or hidden state but I need to toggle independantly individual divs.
I prefer a jQuery solution but whatever worked so far was achieved with native javascript.
Note: If a cross-browser truncate function which would append a more-less link after a number of words (var) in each .comments divs would be easier to implement then I would gladly take that option. Thx for any help, remember I am still learning lol!
I have been working on an entirely JS UI project and have brought myself to using $('', { properties }).appendTo(BaseElement) to work best for adding HTML elements because it appropriately manipulates the DOM every time.
If you are having good luck with push elsewhere, however, breakpointing on the line where you do your $('.class').hide() and see what $('.class').length is. Alternately, you can just add alert($('.class').length) to your code if you are unable to breakpoint the code. If it is 0, then your elements have not been properly added to the DOM. Changing to append will ensure they are part of the DOM and therefore targetable via JQuery.

nyroModal v2: How to validate form opened in iframe?

I'm trying to figure out how to validate a form opened using nyroModal.
The page is being opened as below on click of a button:
$(function() {
$('.btnedit').click(function() {
$.nmManual('form_page.php);
});
});
On the form that opens up, I have a few fields that are mandatory and a cancel & submit button.
<a class="nyroModalClose button" href="#" id="btn_submit">Submit</a>
On clicking of the submit button, I want to make sure the mandatory fields have value. If no, an error message should be displayed & the modal window should not close.
I'm trying to use the jquery validation plugin, but without success. The modal window always closes irrespective of the validation scripts.
I haven't found much info regarding form validation in a modal window. Is this not a preferred approach?
Thanks in advance.
I'm not able to help you about the jquery validation plugin in a modal window, but I know that using the instruction $.nmManual in that way, the form will not be placed inside the iframe tag, and if I remember correctly the content of new page will be added without header and body tags, so in a word incorrectly. I guess this can produce no validation.
To successfully open an iframe you need to use filters as described here:
Open iframe manually in nyroModal?
I hope this can help you.