Avatar of Ralph
Ralph
Flag for United States of America asked on

My simple JS functions failing after adding DataTables()

I am NOT a JS expert, I just program well in other languages and do the same w/ what I know about JavaScript.

Some of this code is not even being accessed, but apparently scanned.
All have been in my 'library' file for months, some of it accessed at times, some never.  Even the `never` is burping.

The never-used code that burps:
// *************************************************************************************************

String.prototype.string_reverse = function () 
{ alert('this='+this);                                         // Object = Window!?
  return this.split('').reverse().join('');           // CRASHes
};

// usage:  str = str.string_reverse() ;
// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
function reverse(s) 
{
  return s.split('').reverse().join('');
}
// *************************************************************************************************
// *************************************************************************************************

String.prototype.replaceLast = function (what, replacement) 
{
  return what.string_reverse().replace(new RegExp(what.string_reverse()), replacement.string_reverse()).string_reverse();
};

// usage:  str = str.replaceLast('one', 'finish');

Open in new window

The is-used code that burps:
// *************************************************************************************************

String.prototype.strip_phone_format = function ()
{
  
  var phone=this.replace("(","") ;     // Error msg:  LibraryScripts.js:318 Uncaught TypeError: this.replace is not a function
  phone=phone.replace(" ","") ;
  phone=phone.replace(")","") ;
  phone=phone.replace("-","") ;
  
  return phone ;
} ;// *************************************************************************************************
// *************************************************************************************************

String.prototype.add_phone_format = function ()
{
  var just_numbers = this.strip_phone_format() ;
  
  return "("+just_numbers.substr(0,3)+") "+just_numbers.substr(3,3)+"-"+just_numbers.substr(6) ;
} ;

Open in new window


Two, three questions.
  • Why is this just complaining now?
  • Can I get help w/ the as-of-now unused code
  • And the I-Need code?

Thanks!
Ralph

(DataTables() AJAX questions likely to follow.)
JavaScript

Avatar of undefined
Last Comment
Ralph

8/22/2022 - Mon
SOLUTION
ste5an

THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
GET A PERSONALIZED SOLUTION
Ask your own question & get feedback from real experts
Find out why thousands trust the EE community with their toughest problems.
ASKER CERTIFIED SOLUTION
zephyr_hex (Megan)

THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
GET A PERSONALIZED SOLUTION
Ask your own question & get feedback from real experts
Find out why thousands trust the EE community with their toughest problems.
Ralph

ASKER
From page shown in Prelist form.png I click the linked #.

The link's target page list_plan_levels.html consists of my libraries above the comment delimiter, the DataTables() libraries below, then the HTML Table template.

The JS that get's me to Target page is found in excerpts from WorkflowScripts.js.

WorkflowScripts.js (Lots left out because this works.)
// **********************************************************************************
function review_plan_levels()
{ 
  
  $('body').on( "click", 'a.UpDowngrade', listPlanLevelsClick ) ;
  
 ...
 ...
  // -----------------------------------------------------------------------------------------------
  function PlansMetricsSummary_up_gradeable(answer)
  { 
      
    $('#PleaseWait1').fadeOut("fast") ;
    setTimeout(function(){ $('#reference_period').css('width', '245px') ; }, 1000);
    
    $('#body1_1_1').html(posted_period) ;
    
    var Up1 = answer[1]['Upon Import'] ;
    var RemainingUp = answer[1]['# Remaining'] ;
    var Up2 = answer[2]['Upon Import']  ;
    var Up3 = answer[3]['Upon Import']  ;
    
    if ( Up1 != 0 )
    {  $('#body1_1_2').html('<a href="/cmdb/public_html/Work/list_plan_levels.html" class="UpDowngrade" data-target="center_body" data-pp="'+posted_period+'" data-scope="PP" data-updown="UP">'+Up1+'</a>') ; }
    else
    {  $('#body1_1_2').html('0') ; }
    $('#body1_1_3').html(answer[1]['# Reviewed']) ;
    $('#body1_1_4').html(answer[1]['# Resolved']) ;
    if ( RemainingUp != 0 )
    {  $('#body1_1_5').html(RemainingUp) ; }
    else
    {  $('#body1_1_5').html('0') ; }
    
    if ( Up2 != 0 )
    {  $('#body1_2_2').html('<a href="/cmdb/public_html/Work/list_plan_levels.html" class="UpDowngrade" data-target="center_body" data-pp="'+posted_period+'" data-scope="PP-1" data-updown="UP">'+Up2+'</a>') ; }
    else
    {  $('#body1_2_2').html('0') ; }
    $('#body1_2_3').html(answer[2]['# Reviewed']) ;
    $('#body1_2_4').html(answer[2]['# Resolved']) ;
    $('#body1_2_5').html(answer[2]['# Remaining']) ;
    
    if ( Up3 != 0 )
    {  $('#body1_3_2').html('<a href="/cmdb/public_html/Work/list_plan_levels.html" class="UpDowngrade" data-target="center_body" data-pp="'+posted_period+'" data-scope="PP-2" data-updown="UP">'+Up3+'</a>') ; }
    else
    {  $('#body1_3_2').html('0') ; }
    $('#body1_3_3').html(answer[3]['# Reviewed']) ;
    $('#body1_3_4').html(answer[3]['# Resolved']) ;
    $('#body1_3_5').html(answer[3]['# Remaining']) ;
    
  }
}

Open in new window

listPlanLevelsClick() and the JS .ready() function
// =================================================================================================
// This function responds to clicks in prelist_plan_levels.html

function listPlanLevelsClick()  
{ 
  
  
  alert("inside function listPlanLevelsClick()") ;
  
  var UpDown        = $(this).data('updown');
  var posted_period = $(this).data('pp');
  var scope         = $(this).data('scope');
  
  localStorage.UpDown = UpDown ;
  localStorage.posted_period = posted_period ;
  localStorage.scope = scope ;
  
}

// ==================================================================================
// .ready() function for page:  list_plan_levels.html

function list_plan_levels()
{
  alert("inside function list_plan_levels(), the new page's .ready() function.") ;
  
  
  var UpDown = localStorage.UpDown ;
  var posted_period = localStorage.posted_period ;
  var scope = localStorage.scope  ;
  
  var php_params = 'job=UpDownGrade&UpDown='+UpDown+'&posting_period='+posted_period+'&scope='+scope ; 
  
  $('#debug').html(php_params) ;
  
  
  $('#UpDownGrade').DataTable(
    {
      ajax: {
      url:        '/cmdb/PHP/do_DataTables_query.php' , 
      data:       php_params ,
      dataSrc:    'values'
    },
    columns: [
        { data: 'View' }
      , { data: 'Select' }
      , { data: 'Commit' }
      , { data: 'wireless #' }
      , { data: 'serial #' }
      , { data: 'curr usage' }
      , { data: 'curr limit' }
      , { data: 'curr code' }
      , { data: 'better code' }
      , { data: 'prior inv.' }
      , { data: 'prior usage' }
      , { data: 'prior code' }
      , { data: 'prior inv.' }
      , { data: 'prior usage' }
      , { data: 'prior code' }
      , { data: 'Show' }
      , { data: 'Mark' }
    ]
    } );

}

Open in new window

Code fragment that generates data for DataTables(), invoked above (MAYBE).
case "UpDownGrade":
        
        $UpDown = $_GET['UpDown'] ;
        $scope  = $_GET['scope'] ;
        $posted_period = $_GET['posted_period'] ;
        
        do_mysql_multi('CALL UpDownGradeList("'.$UpDown.'", "'.$posted_period.'", "'.$scope.'") ;', 1, $result_vector1, $result_vector2) ;
        
        $ArrayOfObj = array() ;
        
        for ($i=1, $nrows = $result_vector1['nrows']; $i<=$nrows; $i++)
        {
          $ArrayOfObj[] = $result_vector1['values'][$i] ;
        }
        
        echo json_encode($ArrayOfObj) ;
        
        break ;

Open in new window

When I lick the #-link I get the error shows in error1.png, NO table of data, and NOT constrained to DIV w/ ID="center_body".

Please let me know if I need to provide more.

I did try removing my reference to jquery-2.2.3, but the link https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js does not suffice as a substitute.  LOTS of errors.

Thanks again,
Ralph
PreList-form.PNG
error1.PNG
list_plan_levels.html
zephyr_hex (Megan)

How is this.replace used in LibraryScripts.js ?
Ralph

ASKER
Thank you both.
Turns out, I should have known, new JS code inside DataTable() was causing problems elsewhere in the application.

I'll very soon be making a DataTable() inquiry, but got some of it working!!!
All of life is about relationships, and EE has made a viirtual community a real community. It lifts everyone's boat
William Peck