Customizing HTML Editor Quicktags button to open a dialog for choosing insert options
I am looking for adding custom quicktag buttons, that would allow me to display a intermediary dialog before inserting the code.
Situation
- Clicking a quicktag button opens a dialog or thickbox modal window.
- Opened dialog displays some options on the class, etc and an Insert button.
- Clicking "Insert" button inserts the code.
Background
To add an quicktags button, we would use
edButtons[ edButtonsLength+ ] = new edButton(
'ed_mybutton' , 'Insert button', 'div class="class-name"', '/div'
);
////
edHTML += 'input type="button" value="Insert custom code" id="ed_my_button" class="ed_button" onclick="edInsertTag( edCanvas, edButtonLength_t + 1)" title="Insert code" /';
Now how can i bypass the button to open a dialog(or thickbox modal) instead?
I can add a button without defining it, like
edHTML += 'input type="button" value="Insert custom code" id="ed_my_button" class="ed_button" onclick="customFunction()" title="Insert code" /';
// and
var customFunction = function() {
openURL = '?php admin_url() ?admin-ajax.php?action="insertCodeActionTB_iframe=true';
tb_show( 'Insert custom code', openURL );
};
Please share your wisdom. Thanks in advance.
PS: doing this with TinyMCE is relatively easy, i wonder how do i do that with HTML quicktags. :)