Jump to content

Archived

This topic is now archived and is closed to further replies.

jbog91

Text link to textbox

Recommended Posts

This little script is really cool and I would love to put it in some of my php scripts. But I know nothing of javascript and no idea how to make this. I have seen the file that does this but as I said I don't know how to edit it to work in my scripts so, and it's property of ipb since it's used on their boards.

If you have ipb you know what I'm talking about and you can find the file.

Here is a video of what I'm talking about: (btw:if anyone knows of a better file upload site, please let me know)
[a href=\"http://www.megaupload.com/?d=B2D2063F\" target=\"_blank\"]http://www.megaupload.com/?d=B2D2063F[/a]

Does anyone know of another script for download or a turorial or something on how to do this?

Thanks

Share this post


Link to post
Share on other sites
That my friend is AJAX at work. Have a search for AJAX on google and you should get a few results.

Share this post


Link to post
Share on other sites
Oh really? I thought ajax was a load of crap but I guess not. It might be good for the me learn that.

Thanks.

Share this post


Link to post
Share on other sites
Well, I've search google with ajax in mind but I still can't find anything like this. I just don't understand the code all that well and I wouldn't know how to pass the variable from php and stuff so I could update the data in mysql and stuff. Here is the code if anyone can make sense of it and tell me if they've seen anything like it I could use.

[code]
//------------------------------------------
// Invision Power Board v2.1
// Forums JS File
// © 2005 Invision Power Services, Inc.
//
// [url=http://www.invisionboard.com]http://www.invisionboard.com[/url]
//------------------------------------------

/*--------------------------------------------*/
// INIT
/*--------------------------------------------*/

var topic_dates      = {};
var topic_flags      = {};
var forum_mark_time;
var newer_topics     = new Array;
var newer_count      = 0;
var flags_count      = 0;
var forum_id;
var url_extra        = '';
var start_int        = 0;
var forum_mark_sent  = 0;
var span_html        = new Array;
var desc_html        = new Array;
var text_html        = new Array;
var folders          = new Array;
var _desc_clicked    = 0;
var topic_links_init = 0;

var tid_date    = new Array();

var click_delay = 1200; //microseconds (1.2 seconds)

/*--------------------------------------------*/
// Pop up mod options
/*--------------------------------------------*/

function forum_mod_pop( fid )
{
    try
    {
        menu_action_close();
    }
    catch(e) { }
    
    PopUp( ipb_var_base_url + 'act=mod&CODE=prune_start&f='+fid+'&auth_key='+ipb_md5_check, 'PRUNE', 600,500);
}

/*--------------------------------------------*/
// INIT topic links...
/*--------------------------------------------*/

function forum_init_topic_links()
{
    //----------------------------------
    // Get page links...
    // Gah.. another safari bug
    //----------------------------------
    
    var pagelinks = document.getElementsByTagName('a');
    
    //----------------------------------
    // Sort through and grab topic links
    //----------------------------------
    
    for ( var i = 0; i <= pagelinks.length; i++ )
    {
        try
        {
            if ( ! pagelinks[i].id )
            {
                continue;
            }
        }
        catch(e)
        {
            continue;
        }
        
        var linkid   = pagelinks[i].id;
        var linkname = linkid.replace( /^(.*)-(\d+)$/, "$1" );
        
        if ( linkname == 'tid-link' )
        {
            pagelinks[i].onmousedown  = topic_link_event_mousedown;
            pagelinks[i].onmouseup    = topic_link_event_mouseup;
            //pagelinks[i].style.cursor = 'text';
            
            if ( ! topic_links_init )
            {
                pagelinks[i].title = pagelinks[i].title + '. ' + lang_clickhold;
            }
        }
    }
    
    topic_links_init = 1;
}

/*--------------------------------------------*/
// Mousedown, start timer
/*--------------------------------------------*/

function topic_link_event_mousedown( event )
{
    //----------------------------------
    // Prevent link loading
    //----------------------------------
    
    event = global_cancel_bubble( event, true );
    
    //----------------------------------
    // Get TID
    //----------------------------------
    
    var tid = _get_tid_from_id( this.id );
    
    //----------------------------------
    // Start...
    //----------------------------------
    
    tid_date[ tid ] = _get_time_now();

    //----------------------------------
    // Start loop
    //----------------------------------
    
    setTimeout( "topic_link_event_timer("+tid+")", 5 );
}

/*--------------------------------------------*/
// Event, loop
/*--------------------------------------------*/

function topic_link_event_timer( tid )
{
    //----------------------------------
    // Get time now
    //----------------------------------

    var timenow = _get_time_now();
    
    //----------------------------------
    // Click held for 1.5 s+?
    //----------------------------------
    
    if ( timenow > 0 && tid_date[tid] > 0 && ( (timenow - tid_date[tid] ) > click_delay ) )
    {
        //----------------------------------
        // Yeah.. wipe tid time and convert
        //----------------------------------
        
        tid_date[tid] = 0;
        span_to_input( tid );
        return false;
    }
    
    //----------------------------------
    // Not wiped? loop on!
    //----------------------------------
    
    if ( tid_date[tid] > 0 )
    {
        setTimeout( "topic_link_event_timer("+tid+")", 5 );
    }
    else
    {
        return false;
    }
}

/*--------------------------------------------*/
// Mouseup? Cancel timer to kill the loop
/*--------------------------------------------*/

function topic_link_event_mouseup( event )
{
    //----------------------------------
    // Prevent link loading
    //----------------------------------
    
    event = global_cancel_bubble( event, true );
    
    //----------------------------------
    // Get TID
    //----------------------------------
    
    var tid = _get_tid_from_id( this.id );
    
    //----------------------------------
    // Reset timer
    //----------------------------------
    
    tid_date[tid] = 0;
}

/*--------------------------------------------*/
// Get time now
/*--------------------------------------------*/

function _get_time_now()
{
    var mydate = new Date();
    return mydate.getTime();
}

/*--------------------------------------------*/
// Get TID from ID
/*--------------------------------------------*/

function _get_tid_from_id( id )
{
    return id.replace( /.*\-(\d+)/, "$1" );
}


/*--------------------------------------------*/
// Turn topic title into text input
/*--------------------------------------------*/

function topic_toggle_folder( tid )
{
    //----------------------------------
    // Using fancy js?
    //----------------------------------
    
    if ( ! use_enhanced_js )
    {
        return false;
    }
    
    //----------------------------------
    // Can edit?
    //----------------------------------
    
    if ( ! perm_can_open && ! perm_can_close )
    {
        return false;
    }
    
    var td_content = document.getElementById( 'tid-folder-' + tid ).innerHTML;
    var state;
    
    if ( td_content.match( new RegExp( "/("+img_folder_closed+")([\"'])", "i" ) ) )
    {
        //----------------------------------
        // Can?
        //----------------------------------
        
        if ( ! perm_can_open )
        {
            return false;
        }
        
        //----------------------------------
        // Topic is locked
        //----------------------------------
        
        if ( folders[ tid ] )
        {
            td_content = folders[ tid ];
        }
        else
        {
            td_content = td_content.replace( new RegExp( "([\"'])(.*)/(.+?)([\"'])"), "$1$2/"+img_folder_normal+"$4" );
        }
        
        state = 'open';
    }
    else
    {
        //----------------------------------
        // Can?
        //----------------------------------
        
        if ( ! perm_can_close )
        {
            return false;
        }
        
        //----------------------------------
        // Topic isn't locked
        //----------------------------------
        
        folders[ tid ] = td_content;
        td_content     = td_content.replace( new RegExp( "([\"'])(.*)/(.+?)([\"'])"), "$1$2/"+img_folder_closed+"$4" );
        state          = 'closed';
    }
    
    document.getElementById( 'tid-folder-' + tid ).innerHTML = td_content;

    /*--------------------------------------------*/
    // Main function to do on request
    // Must be defined first!!
    /*--------------------------------------------*/
    
    do_request_function = function()
    {
        //----------------------------------
        // Ignore unless we're ready to go
        //----------------------------------
        
        if ( ! xmlobj.readystate_ready_and_ok() )
        {
            // Could do a little loading graphic here?
            return;
        }
        
        //----------------------------------
        // INIT
        //----------------------------------
        
        var returned = xmlobj.xmlhandler.responseText;
    }
    
    //----------------------------------
    // LOAD XML
    //----------------------------------
    
    xmlobj = new ajax_request();
    xmlobj.onreadystatechange( do_request_function );
    
    xmlobj.process( ipb_var_base_url + 'act=xmlout&do=save-topic&type=openclose&name='+state+'&md5check='+ipb_md5_check+'&tid='+tid );
    
    return false;
}

/*--------------------------------------------*/
// Turn topic title into text input
/*--------------------------------------------*/

function span_to_input( tid )
{
    //----------------------------------
    // Using fancy js?
    //----------------------------------
    
    if ( ! use_enhanced_js )
    {
        return false;
    }
    
    //----------------------------------
    // Can?
    //----------------------------------
    
    if ( ! perm_can_edit )
    {
        return false;
    }
    
    //----------------------------------
    // Prevent double click when desc open
    //----------------------------------
    
    if ( _desc_clicked )
    {
        return false;
    }
        
    span_html[ tid ] = document.getElementById( 'tid-span-' + tid ).innerHTML;
    text_html[ tid ] = document.getElementById( 'tid-link-' + tid ).innerHTML;
    
    //----------------------------------
    // Topic title
    //----------------------------------
    
    perm_max_length = perm_max_length ? perm_max_length : 50;
    
    document.getElementById( 'tid-span-' + tid ).innerHTML = '<input id="edit-'+tid+'" class="dny-edit-title" maxlength="'+perm_max_length+'" type="text" size="40" value="'+text_html[ tid ].replace( /"/g, '&quot;') +'" />'; //"'
    document.getElementById( 'edit-' + tid ).onkeyup       = function( event ) { tid_keypress(event, tid) }
    document.getElementById( 'edit-' + tid ).onblur        = function( event ) { tid_blur(tid) }
    document.getElementById( 'edit-' + tid ).focus();
    
    return false;
}

/*--------------------------------------------*/
// Turn topic DESC into text input
/*--------------------------------------------*/

function span_desc_to_input( tid )
{
    //----------------------------------
    // Using fancy js?
    //----------------------------------
    
    if ( ! use_enhanced_js )
    {
        return false;
    }
    
    //----------------------------------
    // Can?
    //----------------------------------
    
    if ( ! perm_can_edit )
    {
        return false;
    }
    
    //----------------------------------
    // Prevent double click when desc open
    //----------------------------------
    
    if ( _desc_clicked )
    {
        return false;
    }
    
    _desc_clicked = 1;
    
    desc_html[ tid ] = document.getElementById( 'tid-desc-' + tid ).innerHTML;
    
    //----------------------------------
    // Topic desc
    //----------------------------------
    
    perm_max_length = perm_max_length ? perm_max_length : 50;
    
    document.getElementById( 'tid-desc-' + tid ).innerHTML = '<input id="edit-'+tid+'" maxlength="'+perm_max_length+'" class="dny-edit-title" type="text" size="40" onblur="tid_blur(\''+tid+'\', \'desc\')" onkeypress="tid_keypress(event, \''+tid+'\',\'desc\')" value="'+desc_html[ tid ].replace( /"/g, '&quot;')+'" />'; //"'
    document.getElementById( 'edit-'     + tid ).focus();
    
    return false;
}

/*--------------------------------------------*/
// BLUR HANDLER
/*--------------------------------------------*/

tid_blur = function( tid, type )
{
    new_text = document.getElementById( 'edit-' + tid ).value;
    
    if( type == 'desc' )
    {
        tid_save( tid, new_text, type );
    }
    else
    {
        if ( new_text != "" )
        {
            tid_save( tid, new_text, type );
        }
    }
}

/*--------------------------------------------*/
// KEY PRESS HANDLER
/*--------------------------------------------*/

tid_keypress = function( evt, tid, type )
{
    if ( is_safari )
    {
        return false;
    }
    
    evt      = evt ? evt : window.event;
    new_text = document.getElementById( 'edit-' + tid ).value;
    
    if ( ( evt.keyCode == 13 || evt.keyCode == 3 ) && new_text != "" )
    {
        tid_save( tid, new_text, type );
    }
}

/*--------------------------------------------*/
// UDPATE DB
/*--------------------------------------------*/

tid_save = function( tid, new_text, type )
{
    var donotedit = 0;
    
    if ( type == 'desc' )
    {
        if ( new_text == desc_html[ tid ] )
        {
            donotedit = 1;
        }
        
        _desc_clicked = 0;
        
        document.getElementById( 'tid-desc-' + tid ).innerHTML = new_text;
    }
    else
    {
        if ( new_text == text_html[ tid ] )
        {
            donotedit = 1;
        }
        
        type = 'title';
        document.getElementById( 'tid-span-' + tid ).innerHTML = span_html[ tid ];
        document.getElementById( 'tid-link-' + tid ).innerHTML = new_text;
        
        //----------------------------------
        // Re-check topic links
        //----------------------------------
        
        forum_init_topic_links();
    }
    
    if ( donotedit )
    {
        return false;
    }
    
    var url    = ipb_var_base_url + 'act=xmlout&do=save-topic&type='+type+'&md5check='+ipb_md5_check+'&tid='+tid;
    var fields = new Array();

    //----------------------------------
    // Populate fields
    //----------------------------------
    
    fields['md5check'] = ipb_md5_check;
    fields['tid']      = tid;
    fields['act']      = 'xmlout';
    fields['do']       = 'save-topic';
    fields['type']     = type;
    fields['name']     = new_text;
    
    /*--------------------------------------------*/
    // Main function to do on request
    // Must be defined first!!
    /*--------------------------------------------*/
    
    do_request_function = function()
    {
        //----------------------------------
        // Ignore unless we're ready to go
        //----------------------------------
        
        if ( ! xmlobj.readystate_ready_and_ok() )
        {
            // Could do a little loading graphic here?
            return;
        }
        
        //----------------------------------
        // INIT
        //----------------------------------
        
        var returned = xmlobj.xmlhandler.responseText;
        
        if ( type != 'desc' && ! returned.match( /<null>s<\/null>/ ) )
        {
            document.getElementById( 'tid-link-' + tid ).innerHTML = returned;
        }

    }
    
    //----------------------------------
    // LOAD XML
    //----------------------------------
    
    xmlobj = new ajax_request();
    xmlobj.onreadystatechange( do_request_function );
    xmlobj.process( url, 'POST', xmlobj.format_for_post(fields) );

    
    return false;
}


/*--------------------------------------------*/
// Who posted
/*--------------------------------------------*/

function who_posted(tid)
{
    window.open("index.php?act=Stats&CODE=who&t="+tid, "WhoPosted", "toolbar=no,scrollbars=yes,resizable=yes,width=230,height=300");
}

/*--------------------------------------------*/
// Check delete
/*--------------------------------------------*/

function checkdelete()
{
    if ( ! document.modform.selectedtids.value )
    {
        return false;
    }
    
    isDelete = document.modform.tact.options[document.modform.tact.selectedIndex].value;
    
    if (isDelete == 'delete')
    {
        formCheck = confirm( lang_suredelete );
        
        if (formCheck == true)
        {
            return true;
        }
        else
        {
            return false;
        }
    }
}

/*--------------------------------------------*/
// Toggle selection
/*--------------------------------------------*/

function forum_toggle_tid( tid )
{
    saved = new Array();
    clean = new Array();
    add   = 1;
    
    //-----------------------------------
    // Get form info
    //-----------------------------------
    
    tmp = document.modform.selectedtids.value;
    
    if( tmp != "" )
    {
        saved = tmp.split(",");
    }
    
    //-----------------------------------
    // Remove bit if exists
    //-----------------------------------
    
    for( i = 0; i < saved.length; i++ )
    {
        if ( saved[i] != "" )
        {
            if ( saved[i] == tid )
            {
                 add = 0;
            }
            else
            {
                clean[clean.length] = saved[i];
            }
        }
    }
    
    //-----------------------------------
    // Add?
    //-----------------------------------
    
    if ( add )
    {
        clean[ clean.length ] = tid;
        eval("document.img"+tid+".src=selectedbutton");
    }
    else
    {
        eval(" document.img"+tid+".src=unselectedbutton");
    }
    
    newvalue = clean.join(',');
    
    my_setcookie( 'modtids', newvalue, 0 );
    
    document.modform.selectedtids.value = newvalue;
    
    newcount = stacksize(clean);
    
    document.modform.gobutton.value = lang_gobutton + ' (' + newcount + ')';
    
    return false;
}

/*--------------------------------------------*/
// Do multi page jump
/*--------------------------------------------*/

function multi_page_jump( url_bit, total_posts, per_page )
{
    pages = 1;
    cur_st = ipb_var_st;
    cur_page  = 1;
    
    if ( total_posts % per_page == 0 )
    {
        pages = total_posts / per_page;
    }
    else
    {
        pages = Math.ceil( total_posts / per_page );
    }
    
    msg = ipb_lang_tpl_q1 + " " + pages;
    
    if ( cur_st > 0 )
    {
        cur_page = cur_st / per_page; cur_page = cur_page -1;
    }
    
    show_page = 1;
    
    if ( cur_page < pages )
    {
        show_page = cur_page + 1;
    }
    
    if ( cur_page >= pages )
    {
        show_page = cur_page - 1;
    }
    else
    {
        show_page = cur_page + 1;
    }
    
    userPage = prompt( msg, show_page );
    
    if ( userPage > 0  )
    {
        if ( userPage < 1 )     {    userPage = 1;  }
        if ( userPage > pages ) { userPage = pages; }
        if ( userPage == 1 )    {     start = 0;    }
        else { start = (userPage - 1) * per_page; }
    
        window.location = url_bit + "&st=" + start;
    }
}
[/code]

Beastly bit a code ain't it?

Share this post


Link to post
Share on other sites
you don't need any Ajax here.
some DOM will be good.

[code]
<p  onclick="document.getElementById( 'TextAreaID' ).focus()">Hello</p>
<textarea id="TextAreaID"></textarea>
[/code]
is that what you looking for ?

Share this post


Link to post
Share on other sites
And that will do what is in the video? It looks like all that does is set the focus to a text field already on the page. Or does that work in corresondenc to the code I posted? Because I see no timer or anthing that could offset the function of turning it into a textbox from the link's regular function of sending you to the thread.

Share this post


Link to post
Share on other sites
The way the link changes to a text box is made by the Javascript DOM, but AJAX is involved to do the edting of the text so the changes get saved to the database.

Share this post


Link to post
Share on other sites

×

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.