X-editable Yii2 : Uncaught TypeError: Cannot read property 'substr' of null

45
May 18, 2019, at 3:40 PM

I'm using Yii2 dosamigos X-editable widget based on vitalet X-editable. I'm using bootstrap 4. In my view file, I'm using nested layout by implementing the beginContent() method. While I'm not using the nested layout, the inline-editing feature works just fine. But while I'm using the nested layout; when I click the editable widget label, the editable field split into two input field on the left and right instead of a single input field. And when I click outside of the field, the input field won't disappear but appear beside the label (the one with "this is 'isiTema'" in the image).

I got this error in the console:

home:959 Uncaught TypeError: Cannot read property 'substr' of null
    at XMLHttpRequest.open (home:959)
    at ajax (home:1482)
    at home:1471
    at home:1820 

Home:1820 })();</script><script src="/assets/ed7e27b/jquery.js"></script>

Home:1511 })();</script><script src="/assets/ed7e27b/jquery.js"></script>

Home:1471 xhr.open(settings.method || 'GET', url, true);

Home:959 (and 958)

 //prevent logging AJAX calls to static and inline files, like templates 
    if (url.substr(0, 1) === '/' && !url.match(new RegExp("{{ excluded_ajax_paths }}"))) {

This is my home view file :

<?php
use yii\helpers\Html;
use yii\grid\GridView;
use yii\helpers\url;
*/
/* @var $this yii\web\View */
/* @var $searchModel app\models\HomeSearch */
/* @var $dataProvider yii\data\ActiveDataProvider */
$this->title = 'Homes';
$this->params['breadcrumbs'][] = $this->title;
?>
    <h1><?= Html::encode($this->title) ?></h1>
 <?php 
 $this->beginContent('@app/views/layouts/main-partial.php'); 
use dosamigos\editable\Editable;
$url=Url::to(['home/fetch']);
 Editable::widget( [
    'model' => $model,
    'attribute' => 'tema',
    'name'=>'tema',
    'id'=>'tema',
    'url' => $url,
    'type' => 'text',
    'mode' => 'pop',
]);
 Editable::widget( [
    'model' => $model,
    'name'=>'isiTema',
    'id'=>'isiTema',
    'url' => $url,
    'type' => 'text',
    'mode' => 'pop',
]);
    ?>
 <section id="intro">
    <div class="intro-container wow fadeIn">
    <h1 class="mb-4 pb-0"> 
    <a href="#" id="tema" name="tema" data-type="text" data-pk=<?=$model->id?> data-url=<?=Url::to(['home/fetch']);?> data-title="Enter username"><?=$model->tema?></a>
</h1>
<br/>
  <h1>  <a href="#" id="isiTema" name="isiTema" data-type="text" data-pk=<?=$model->id?> data-url=<?=Url::to(['home/fetch']);?> data-title="Enter username"><?=$model->isiTema?></a>
</h1>
<br/>
    </div>
</section>
<?php
$url = Url::to(['home/fetch']);
$script = <<< JS
$.fn.editable.defaults.mode = 'inline';
$(document).ready(function(){
     $('#tema').editable();
 $('#isiTema').editable();

});
JS;
$this->registerJs($script);
     $this->endContent();
?>

This is my nested layout main-partial view (I removed $this->endPage() because it didn't work without removing it) :

<?php
/* @var $this \yii\web\View 
*/
/* @var $content string */
use yii\helpers\Html;
use yii\bootstrap\Nav;
use yii\bootstrap\NavBar;
use yii\widgets\Breadcrumbs;
use app\assets\theEventAsset;
use yii\helpers\Url;
theEventAsset::register($this);
?>
<?php $this->beginPage() ?>
<!DOCTYPE html>
<html lang="<?= Yii::$app->language ?>">
<head>
    <meta charset="<?= Yii::$app->charset ?>">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <?= Html::csrfMetaTags() ?>
    <title><?= Html::encode($this->title) ?></title>
    <?php $this->head() ?>
</head>
<body>
<?php $this->beginBody() ?>
        <?= $content ?>
</body>
<?php $this->endBody() ?>
</body>
</html>

I wonder what's wrong. I try updating the asset's editable's js and css file with Bootstrap 4 editable version from https://github.com/Talv/x-editable/tree/develop/dist/bootstrap4-editable but to no avail. Please help. Thanks.

Answer 1

Solved! The $this->endPage() should be there. Not supposed to be removed, my bad.

The problem actually lies on the include order of the editable asset. The asset should be included after the nested layout's assets are registered.

In my case, in my nested layout view it should be :


theEvent2Asset::register($this);
use dosamigos\editable\Editable;
READ ALSO
ipcMain listener not registering correctly

ipcMain listener not registering correctly

Am having some troubles with ipc messages between the main and renderer processes in an electron app

29
Unable to post the data from view to controller in Yii2

Unable to post the data from view to controller in Yii2

I am working on Yii2I have a gridview with checkbox and on a button click I am redirecting it to an action controller using ajax

45
add values of 5 text boxes and show the esult in 6th tetbo on the keypress vent of 5 th textbox

add values of 5 text boxes and show the esult in 6th tetbo on the keypress vent of 5 th textbox

i have 6 text boxes with id a,b,c,d,e,fout of these i enter value for 5

38
react-apollo Server Side Rendering

react-apollo Server Side Rendering

Disclaimer: I saw many other questions on SO which sound the sameBut no, this question and its context, everything is different

53