JavaScript - Tinymce With Jquery Validate With Remote Methods

I integrate TinyMCE with a web application. After plugging in TinyMCE, a textarea shows up on a place where no textarea is defined. So far, this problem happens on a web page with multiple textareas. It seems to be caused by either <fieldset> tag or a <TEXTAREA .. readonly>. A non-defined textarea shows on the top of these elements. Does anyone else run into the same problem?

Thanks.

Hi all,

After over a month of pounding my head against the wall (and getting ZERO help from the TinyMCE "support" forum), I have finally come up with a simple JS function (for the TinyMCE editor) that will wrap a selection with any open and any close tag one wishes, and keeps the selected text selected for further wrapping if desired.

Here's the code (commented heavily):

Code:

/* -------- FOR TINYMCE ONLY --------
* wrap selection with BBCode or other tags
* (c) 2010 r.a.krupski <krupski@roadrunner.com>
* free software - use, modify, distribute freely
** -------- FOR TINYMCE ONLY --------*/
function tinyWrap(open_tag, close_tag)
{
    var ed = (tinymce.activeEditor || opener.tinymce.activeEditor); /* get editor instance */
    var selection = ed.selection.getContent(); /* get user selection, if any */
    var temp_name  = new Date().getTime().toString(36).toLowerCase(); /* generate a unique string */
    var span_open  = '<span id="' + temp_name + '">'; /* generate '<span id="unique">' */
    var span_close = '</span>'; /* generate closing '</span>' */
    selection = selection.replace(/<p>/g,'').replace(/<\/p>/g,'<br />'); /* convert <p></p> to <br /> */
    if (selection.substr(selection.length-6) === '<br />')
    {
        selection = selection.substr(0, selection.length-6); /* strip last <br /> if present */
    }
    /* create complete selection replacement: '<span id="unique">OPEN_TAGselectionCLOSE_TAG</span>' */
    var content = open_tag + span_open + selection + span_close + close_tag;
    ed.execCommand('mceReplaceContent', false, content); /* replace selection with new */
    var span_elem = ed.dom.get(temp_name); /* get the element of the temp span */
    ed.selection.select(span_elem); /* select (highlight) the selection span */
    ed.dom.remove(temp_name, true); /* remove the span, leave it's highlighted text behind(true) */
    ed.focus(); /* insure editor has focus */
    return; /* taa-daa! all done! */
}

Hope this helps someone - I've got a few more gray hairs because of TinyMCE... hopefully this will spare others my agony......

-- Roger

So, i have this code which retrieves php files for me using jquery and id love to get it working with Jquery history plugin. I tried modifying the code i got from the ajax demo to work for me, but i just couldnt do it as i do not know any javascript really.. ( actually what i tried was simply to change "#ajax-links a" to "#menu li a" and .html to .php ..but nothing.. :rolleyes:


Id be very gratefull if someone would help me out with this one.

All related code can be found bellow (the ones that should be needed anyways):

This is the code that retrieves php files inside "#content" when item from "#menu li a" with the specified id is clicked
Code:

$(document).ready(function(){
	//References
	var change = $("#menu li a");
	var loading = $("#loading");
	var content = $("#content");
	
	//Manage click events
	change.click(function(){
		//show the loading bar
		showLoading();
		//load selected section
		if(this.id == "home")
		{
			change.load(this.className='current-page');
			content.slideUp();
			content.load("pages/index.php", hideLoading);
			content.slideDown();
		}
		else if(this.id == "secondpage")
		{
			change.load(this.className='current-page');
			content.slideUp();
			content.load("pages/secondpage.php", hideLoading);
			content.slideDown();
		}
		else
		{
			//hide loading bar if there is no selected section
			hideLoading();
		}
	});

	//show loading bar
	function showLoading(){
		loading
			.css({visibility:"visible"})
			.css({opacity:"1"})
			.css({display:"block"})
		;
	}

	//hide loading bar
	function hideLoading(){
		loading.fadeTo(1000, 0);
	};
});

Heres the structure of the menu/content
Code:

<ul id="menu">
<li><a id="home" class="normal" href="#Home"></a></li>
<li><a id="secondpage" class="normal"  href="#Secondpage"></a></li>		
</ul>

<div id="content">
<ul id="sec-menu">
<li><a id="link1" class="normal" href="#">Link1</a></li>
<li><a id="link2" class="normal"  href="#">Link2</a></li>		
</ul>
</div>

Heres the code that jquery history plugin uses in demo for ajax
Code:

jQuery(document).ready(function($) {
        function load(num) {
            $('#content').load(num +".html");
        }

        $.history.init(function(url) {
                load(url == "" ? "1" : url);
            });

        $('#ajax-links a').live('click', function(e) {
                var url = $(this).attr('href');
                url = url.replace(/^.*#/, '');
                $.history.load(url);
                return false;
            });
    });

Hi,
can anyone tell me...

Code:

function Obj() {
this.recursiveMethod=function () {
       //...how to invoke Obj.recursiveMethod from here?
}
}

Gus

My question is about the following javascript function that converts 15 digit salesforce IDs to 18 digit salesforce IDs. The function was originally posted here.

Developer 1 wrote the function:

function convertToCaseInsensitiveId(id) {
var hash = '';
for (var c = 0; c < 3; c++) {
var h = 0;
for (var i = 0; i < 5; i++) {
var ch = id.charCodeAt(i + c * 5);
if (ch >= 65 && ch <= 91) h += Math.pow(2, i);
}
hash += String.fromCharCode(h > 26 ? h + 48 - 26 : h + 65);
}
return id + hash;
}

Developer 2 said:

Since the checksum numbers are mapped to AB..YZ012345, 25 gives Z. The following line

> hash += String.fromCharCode(h > 26 ? h + 48 - 26 : h + 65);
should be
> hash += String.fromCharCode(h > 25 ? h + 48 - 26 : h + 65);
otherwise 26 would be mapped to opening bracket (ASCII # 91).


Which developer's solution is correct?

hi, i have a jquery problem...

this script is not working with jquery-1.4.2.min, but it works with jquery-1.2.6.min.js, can anyone help me???the script is the above:
(it is not working the tab actions, the slideout works...)
http://www.benjaminsterling.com/wp-c...es/sidetab.htm

the javascript code is the above:
PHP Code:
var jqsideTabs;
var tabs, h = 50, r = 0,ra = 0;
$(document)
.ready(function(){
    jqsideTabs = $('#sideTabs').addClass('closed');
    
    tabs = jqsideTabs
    .find('.tab h3')
    .clone()
    .appendTo(jqsideTabs)
    .each(function(i){
        var that = $(this), cls = '',ow,newThis, newEl;
        
        if( i == 0 ) cls = ' active';
        newEl = $('<a href="#" class="tabLinks'+cls+'">' + that.text() + '</a>');
        that.replaceWith(newEl);
        
        ow = newEl.outerWidth();
        
        if( i == 0 ) ra = ow;
        else r = ow;
        
        h = newEl.css({'top':h , 'right': -ow }).height() + h;
        
        newThis = newEl.get(0);
        newThis.jq = newEl;
        newThis.i = i;
        
        newEl.click(function(){
            var el = this.jq;
            
            if( jqsideTabs.hasClass( 'closed' ) ){
                jqsideTabs.removeClass('closed');
            }
            else if( !jqsideTabs.hasClass( 'closed' ) && el.hasClass('active') ){
                jqsideTabs.addClass('closed');
            }
            
            el
            .siblings()
                .removeClass('active')
                .css({'right': -r })
            .end()
            .addClass('active')
            .css({'right': -ra });
            
            tabs.eq( this.i ).show().siblings('.tab').hide();
            
            return false;
        });
    })
    .end()
    .parent()
        .eq(0)
        .addClass('active')
    .end()
        .filter(':not(:eq(0))')
        .hide()
    .end();
    
    jqsideTabs.bind("mouseleave",function(){
        jqsideTabs
        .animate({left:-310}, 'fast', function(){
            jqsideTabs.addClass('closed').removeAttr('style');
        });
    });
}); 


and the html file is:
[HTML]
<div id="sideTabs">

<div class="tab">
<h3>Tab 1</h3>
<div class="gut">
<p>Some text</p>
</div>
</div>
<div class="tab">
<h3>Tab 2</h3>

<div class="gut">
<ul>
<li>link</li>
</ul>
</div>
</div>
<div class="tab">
<h3>Tab 3</h3>

<div class="gut">
<ul>
<li>link</li>
</ul>
</div>
</div>
</div>
[/HTML]
the problem is that the tab button works, but the content doesnt change...in all of tabs showing the same text(showing all tbas content)....

can anyone help...please.....

I am building a website and I need to gather some information but I feel that prompts are unappealing. Maybe something like a form but it defines whatever is typed in as a variable?

I have a javascript assignment I am having difficulties with. I have most of it complete but need some assistant with the last portion and that is to get my display function to work. I am sure that this is something I should know how to do but for the life of me can't seem to figure out and just need a little guidance.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>

<title>Lab03</title>
<h1> Person Information </h1>

<script type= "text/javascript" charset= "utf-8">
	function Person( ) {
		this.lastname = ' ';
		this.firstname= ' ';
		this.areacode= ' ';
		this.phone_number= ' ';
		this.show_person = ' ';
		}
</script>

<script type= "text/javascript" charset= "utf-8">

	var per1 = new Person
	function getInput( ) {

		lastname= prompt("please enter your last name: ");
		firstname= prompt("please enter your first name: ");
		areacode= prompt("please enter your area code:  ");
		phone_number= prompt ("Please enter your phone number (ex:888-8888):  ");



			return per1;

		}

per1= getInput( );

</script>



</head>
<body>

<script type ="text/javascript" charset= "utf-8">


function show_person( ){

	if( firstname == "" && lastname == "" )

		{
			document.writeln( "Name: Unknown" + "<br/>" );
		}

		else if( firstname == 'null' && lastname == 'null' )

			{
				document.writeln( "Name: Unknown" + "<br/>" );
			}

		else if ( firstname == "" || lastname == "")

			{
				document.writeln("Name:  " + lastname);
				document.writeln(firstname + "<br/>");
			}

		else if ( firstname == 'null' || lastname == 'null')

			{
				document.writeln("Name:  " + lastname);
				document.writeln(firstname + "<br/>");
			}

		else

			{

				document.writeln("Name:  " + lastname + ", ");
				document.writeln(firstname + "<br/>");

			}

		else if ( areacode == "" || phone_number == "" )

			{

				document.writeln ("Phone:  ");
			}

		else if ( areacode == 'null' || phone_number == 'null' )

			{

				document.writeln ("Phone:  ");

			}

		else

			{

				document.writeln('Phone:  (' + areacode + ')');
				document.writeln(phone_number);
			}

				return this.show;
		}



</script>

<noscript>

		<p>You must enable javascript to view all the features of this page.</p>

	</noscript>
</body>
</html>

Can someone help me out and tell me what it is I need to do to make it work? I actually had it working when I was able to put all the code in the get function but was told I needed a separate display function so any input is greatly appreciated.

i keep getting the error

GET http://code.jquery.com/jquery.min.map net::ERR_TOO_MANY_REDIRECTS
& Failed to load resource: net::ERR_TOO_MANY_REDIRECTS

when i load my page...and the havascript doesn't work properly on ym page...how do i resolve this.

thanx in advance

I am trying to create a function that takes a users input in the form xx/xx/xxxx. Then I need to figure out a way to compare to a new date and give which day of the year it is when using: alert("This is the" +foo+ "day of the year."). Im alittle confused on how to take the users input and compare it somehow to give me the day of the year.

Hello all.

I have a script to prompt a user for 4 pieces of information.

First name.
Last name
Area code.
& Telephone number.

My assignment was to do this, and put the information is as follows.

If both, first name & last name are entered, store in object as

last name,first name.

If only one is entered. display without the comma.

Also store telephone number in (XXX) XXX-XXXX format.

I was told to use methods to do all of these things.

Please take note I am in a VERY basic javascript class.

Thanks in advance.

CODE I HAVE SO FAR :


head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>


<script type="text/javascript">
last=name=area=num='';

function info ( ) {
last = prompt("Please enter your last name",'');
name = prompt("Please enter your first name",'');
area = prompt("Please enter your area code",'');
num = prompt("Please enter your phone number",'');
};

function Person (info) {
this.name = name
this.last = last
this.area = area
this.num = num
}

</script>

<title></title>
</head>

<body>

<script type="text/javascript">




info ( );

teacher = new Person();

tempString='';

document.writeln ( last );
document.writeln ( name) ;

if(area==''||num==''){tempString='';}
else{tempString = teacher.area +''+ teacher.num}

document.writeln ( tempString);

</script>

Okay so I'm trying to come up with as many alternative methods to accomplish something. So I'm just seeking input from anyone who is willing to supply some.

After the user clicks on a match type it'll know HOW MANY sides to the match there are so say for a singles match it'd have 2 sides (1 vs. 1) for a Triple Threat Match it'd have 3 sides (1 vs. 1 vs. 1) and so on. All matches have a stored field in the database of how many sides they have.

So I'm thinking that I could have it create 3 divs (or something) down in the competitors area of how many sides there are in the match (separated by a VS. text block) and when the user selects a character from the dropdown and adds a character the user can maybe drag and drop the character's name to whatever side they choose.

Its one idea. If you think of an EASIER more EFFICIENT way to do something like this and have an idea say something please or even if you can't let me know that you think it's a worth while idea.

Code:

<label for="matchtypedrop<?php echo $i+1 ?>">Match Type:</label>
            <select class="dropdown" name="matchtypedrop<?php echo $i+1 ?>" id="matchtypedrop<?php echo $i+1 ?>" title="Match Type <?php echo $i+1 ?>">
                <option value="0">- Select -</option>
               <?php
                $query = 'SELECT id, matchtype FROM matchtypes';
                $result = mysqli_query ( $dbc, $query ); // Run The Query
                while ( $row = mysqli_fetch_array ( $result, MYSQL_ASSOC ) ) { 
                    print "<option value=\"".$row['id']."\">".$row['matchtype']."</option>\r";
                }
                ?>
            </select>

<label for="competitors<?php echo $i+1 ?>">Competitors:</label><ul id="competitors<?php echo $i+1 ?>" style="list-style: none; margin-left: 195px;"></ul>
            <select class="dropdown" name="charactersdrop<?php echo $i+1 ?>" id="charactersdrop<?php echo $i+1 ?>" title="Characters Dropdown <?php echo $i+1 ?>" style="margin-left: 195px;">
                <option value="0">- Select -</option>
               <?php
                $query = 'SELECT id, `character` FROM characters ORDER BY `character`';
                $result = mysqli_query ( $dbc, $query ); // Run The Query
                while ( $row = mysqli_fetch_array ( $result, MYSQL_ASSOC ) ) { 
                    print "<option value=\"".$row['id']."\">".$row['character']."</option>\r";
                }
                ?>
            </select>
            <input type="button" value="Add Character" class="" onclick="Competitors(<?php echo $i+1 ?>)"/>

Hi all! I'm pretty new to JavaScript and completely new to this forum. I'm James.

Well uh, I'm not sure how to...

I wanted to make something like this using javascript...

Code:

myObject.someMethod('something').anotherProperty

much like the

Code:

document.getElementById('someId').style.morestuff

But the thing is, I've been around every DOM whatnot I can find, I just can't seem to make it work.

I kinda need it to make my own DOM for some API i'm writing. So I can write like...

Code:

function someGreatAPI(){
     this.property1='';
     this.property2='';
     //...
     this.method1 = function(var1){            //this should make my firstMethod
           this.nestedProperty = 0;
           this.nestedMethod = someFunction;  //firstMethods nested method

     }
}

//so I can use it like...

var obj = new someGreatAPI();
obj.method1(10).nestedMethod();

It has to be possible, it's possible with document.getelementbyid, right? it has to be.

Thanks in advance.