Функция не определяется при вызове функции Js в PHP Laravel - PullRequest
0 голосов
/ 17 июня 2019

Я работаю над проектом Laravel. В моем виде лезвия у меня есть функция Javascript, подобная этой:

<script type="text/javascript">

        function autoFill (dropDown, emptyDropDown) {
            $("#" + dropDown ).change(function() { 

                $.ajax({
                    type: "GET",
                    url: "https://api.myjson.com/bins/bcnss",

                    success: function(response){

                        var dataLength = response.length;

                        $("#" + emptyDropDown).empty();

                        $("#" + emptyDropDown).append("<option value=''>Select</option>");
                        for( var i = 0; i< dataLength; i++){
                            var id = response[i].id;
                            var name = response[i].name;
                            $("#" + emptyDropDown).append("<option value='"+id+"'>" + name + " </option>");
                        }                 
                    }
                });
            });
        }

    </script>

Затем я вызываю эту функцию в теге body и передаю ей два параметра php:

<?php echo "<script> autoFill('$dropDown', '$emptyDropDown'); </script>"; ?>

Но когда я запускаю это, я получаю ошибку: «Uncaught ReferenceError: автозаполнение не определено».

Вот мой полный код в режиме лезвия, если хотите:

<body>
        <div class="flex-center position-ref full-height">

            <div class="content">
                <div class="title m-b-md">
                    Activiti Form
                </div>

            @if(isset($formDataResult) && isset($dropdownValue))

                <div class="links">
                    <form action="{{ url('handle-form') }}" method="POST">
                            <!--Loop form data and call components to render form-->
                            @foreach($formDataResult as $formDataValue)
                                <div class="links">   
                                        
                                    @if($formDataValue['type'] == 'select')

                                        @if(array_key_exists('description',$formDataValue))

                                            <?php
                                                $dropDown = $formDataValue['name']
                                            ?>
                                        
                                            @component('components/InputSelect',[
                                                'name' =>   $formDataValue['label'],
                                                'id' => $formDataValue['name'],
                                                'enumData' => $dropdownValue
                                            ])
                                            @endcomponent

                                        @else

                                            <?php
                                                $emptyDropDown = $formDataValue['name'];
                                            ?>

                                            @component('components/EmptyInputSelect',[
                                                'name' =>   $formDataValue['label'],
                                                'id' => $formDataValue['name']
                                            ])
                                            @endcomponent

                                        @endif

                                    @elseif($formDataValue['type'] == 'text')

                                        @component('components/InputText',[
                                            'name' => $formDataValue['label'],
                                            'id' => $formDataValue['name'],
                                            'type'=>$formDataValue['type']
                                        ])
                                        @endcomponent

                                    @endif
                                    <br>
                                </div>
                            @endforeach

                            <?php echo "<script> autoFill('$dropDown', '$emptyDropDown'); </script>"; ?>

                            <!--Hidden input to store task id-->
                            @component('components/HiddenInput',[
                                    'id' => $taskId
                                ])
                            @endcomponent  
                             
                        <div>
                            <input type="reset" value="Reset Form">
                            <button type="submit">Complete Task</button>
                        </div>
                    </form>
                </div>
                <!--If don't have form data, show error alert-->
                @else
                    <div class="alert">
                        <span class="closebtn" onclick="this.parentElement.style.display='none';">&times;</span> 
                        <strong>Notice!</strong> There are no tasks at this moment! 
                    </div>
                @endif
            </div>
        </div>
    </body>

    <script type="text/javascript">

        function autoFill (dropDown, emptyDropDown) {
            $("#" + dropDown ).change(function() { 

                $.ajax({
                    type: "GET",
                    url: "https://api.myjson.com/bins/bcnss",
                                              
                    success: function(response){
                        
                        var dataLength = response.length;
                        
                        $("#" + emptyDropDown).empty();
                    
                        $("#" + emptyDropDown).append("<option value=''>Select</option>");
                        for( var i = 0; i< dataLength; i++){
                            var id = response[i].id;
                            var name = response[i].name;
                            $("#" + emptyDropDown).append("<option value='"+id+"'>" + name + " </option>");
                        }                 
                    }
                });
            });
        }
        
    </script>

Как я могу это исправить?

Большое спасибо!

Ответы [ 2 ]

1 голос
/ 17 июня 2019

Вы пытаетесь вызвать функцию, прежде чем ее определить. Поставьте <script type="text/javascript">...</script>, определяющий функцию , перед вашим <script> autoFill('$dropDown', '$emptyDropDown'); </script>, который пытается ее вызвать.

0 голосов
/ 17 июня 2019

Вы можете прочитать значение JS для использования PHP.Но вы можете вывести значение js на экран HTML.

У вас есть тег <span> или <div> с атрибутом class или id, после чего вы можете поместить в него свое значение.

Вот ваша функциональность js

<script>

    // whatever value you need in your js from PHP. you need to below code.

    let dropdown = <?php echo $dropDown; ?>
    let emptyDropdown = <?php echo $emptyDropDown; ?>


    // now pass your js variables here.
    function autoFill (dropDown, emptyDropDown) {
        $("#" + dropDown ).change(function() { 

            let $this = $(this);

            $.ajax({
                type: "GET",
                url: "https://api.myjson.com/bins/bcnss",

                success: function(response){

                    var dataLength = response.length;

                    $("#" + emptyDropDown).empty();

                    $("#" + emptyDropDown).append("<option value=''>Select</option>");
                    for( var i = 0; i< dataLength; i++){
                        var id = response[i].id;
                        var name = response[i].name;
                        $("#" + emptyDropDown).append("<option value='"+id+"'>" + name + " </option>");
                    }
                }
            });
        });
    }
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...