我可以在javascript中打开自己的对话框并传递值对象吗？

我想运行此对话框代码并将值对象传递给它。单击此链接时，值对象被正确传递。如果有任何方法调用my div=“#myModel”并将值传递给它

  <!-- Modal -->
<div class="modal fade" id="myModal" role="dialog"> 
    <div class="modal-dialog">


        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="btn btn-default" style='float: right;' data-dismiss="modal"><span class="glyphicon glyphicon-remove-circle"></span></button>
                <a href="#" class="btn btn-default" style='float: right;'> <span class="glyphicon glyphicon-trash"></span> </a>
                <a href="#" class="btn btn-default" style='float: right;'> <span class="glyphicon glyphicon-pencil"></span> </a>
                <h4 class="modal-title">BASL  Officers  Details {{ $basl_officer }} </h4>
            </div>



            <!-- text input -->
            <div class="modal-body">

                {!! Form::label('o_code', 'Officers Code: '); !!}
                {!! Form::text('officers_code', null, ['class' => 'form-control', 'id' => 'officers_code','disabled' => 'disabled']); !!}


                {!! Form::label('o_name', 'Officers Name: '); !!}
                {!! Form::text('officers_name', null, ['class' => 'form-control', 'id' => 'officers_name','disabled' => 'disabled']); !!}


            </div>
        </div>

    </div>
</div>

BASL官员详情{{$BASL_官员}
{！！Form:：label（'o_code'，'Officers code:'）
{！！Form:：text（'officers_code'，null，['class'=>'表单控件'，'id'=>'officers_code'，'disabled'=>'disabled']）
{！！Form:：label（'o_name'，'Officers name:'）
{！！Form:：text（'officers_name'，null，['class'=>'表单控件'，'id'=>'officers_name'，'disabled'=>'disabled']）

JavaScript代码

 <script type="text/javascript">

            function showData(x) {
            // console.log(x);
                   alert('You clicked the top text' + x['code']);

                    $("#myModal").dialog({
                          autoOpen: true

                    });
            }

</script>

函数showData（x）{
//控制台日志（x）；
警报（'您单击了顶部文本'+x['code']）；
$（“#myModal”）。对话框({
自动打开：正确
});
}

请期待一些帮助尽快。这所有的代码在同一页

////////////////////完整代码///////////////////////////////////////////

  @extends('layouts.app')

@section('slide_bar')
@include('layouts.master_entry_slide_bar')
@endsection

@section('content')




<section class="content-header">
    <h1>BASL  Officers  <small>page </small></h1>
</section>


<br/>

<!-- Main content -->
<section class="content fluid">
    <div class="row">
        <div class="box">
            <div class="gap">
                <div class="box-body">
                    <table id="example1" class="table table-bordered table-striped">
                        <col width='auto'>
                        <col width='auto'>
                        <col width='100'>

                        <thead>
                            <tr>
                                <th>BASL Officers Code</th>
                                <th>BASL Officers Name</th>
                                <th><p id='buttons'> <a href="{{ route('basl_officers_page.create')}}" class="btn btn-success"> <strong> Add New Officers &nbsp </strong> <span class="glyphicon glyphicon-plus"></span> </a> </p></th>
                        </tr>
                        </thead>
                        <tbody>                  

                            @foreach ($basl_officers as $basl_officer)
                            <tr >
                                <td><a href="#" data-toggle="modal" data-target="#myModal">{{ $basl_officer->code }} </a></td>        
                                <td><a href="#" onClick="showData({{ json_encode($basl_officer) }})">{{ $basl_officer->officerName }} </a></td>        
                                <td align='center'>
                                    {!! Form::open(['method' => 'DELETE', 'route'=>['basl_officers_page.destroy',$basl_officer->id]]) !!}
                                    <a href="{{route('basl_officers_page.edit',$basl_officer->id)}}" class="btn btn-default btn-sm"> <span class="glyphicon glyphicon-pencil"></span> </a> &nbsp &nbsp
                                    <button type="submit" class="btn btn-default btn-sm" onclick="return confirm('Are you sure?')"> <span class="glyphicon glyphicon-trash"></span> </button> 
                                    {!! Form::close() !!}
                                </td> 
                            </tr>


                            @endforeach

                        </tbody>
                        <tfoot>
                            <tr>
                                <th>BASL Officers Code</th>
                                <th>BASL Officers Name</th>
                                <th></th>
                            </tr>
                        </tfoot>
                    </table>
                </div><!-- /.box-body -->
            </div><!-- /.box -->
        </div>

    </div><!-- /.row -->

</section><!-- /.content -->

<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog"> 
    <div class="modal-dialog">


        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="btn btn-default" style='float: right;' data-dismiss="modal"><span class="glyphicon glyphicon-remove-circle"></span></button>
                <a href="#" class="btn btn-default" style='float: right;'> <span class="glyphicon glyphicon-trash"></span> </a>
                <a href="#" class="btn btn-default" style='float: right;'> <span class="glyphicon glyphicon-pencil"></span> </a>
                <h4 class="modal-title">BASL  Officers  Details {{ $basl_officer }} </h4>
            </div>



            <!-- text input -->
            <div class="modal-body">

                {!! Form::label('o_code', 'Officers Code: '); !!}
                {!! Form::text('officers_code', null, ['class' => 'form-control', 'id' => 'officers_code','disabled' => 'disabled']); !!}


                {!! Form::label('o_name', 'Officers Name: '); !!}
                {!! Form::text('officers_name', null, ['class' => 'form-control', 'id' => 'officers_name','disabled' => 'disabled']); !!}


            </div>
        </div>

    </div>
</div>


<script>
            var name = document.getElementById("master_entry");
            document.getElementById("master_entry").className = "active";
            var slide_bar_element = document.getElementById("bd_menu");
            document.getElementById("bd_menu").className = "active";
            var slide_bar_element = document.getElementById("bd_submenu1");
            document.getElementById("bd_submenu1").className = "active";</script>

<script type="text/javascript">

            function showData(x) {

                $("#myModal").dialog({
                    autoOpen: true
               });
            }

</script>




@endsection

@extends（'layouts.app'））
@节（“滑动条”）
@包括（'layouts.master\u entry\u slide\u bar'）
@端部
@节（“内容”）
巴塞尔官员页


巴塞尔军官守则
巴塞尔官员姓名

@foreach（$basl_高级职员作为$basl_高级职员）
{！！Form:：open（['method'=>'DELETE'，'route'=>['basl\u officers\u page.destroy'，$basl\u officer->id]]）
 
{！！Form:：close（）！！}
@endforeach
巴塞尔军官守则
巴塞尔官员姓名
BASL官员详情{{$BASL_官员}
{！！Form:：label（'o_code'，'Officers code:'）
{！！Form:：text（'officers_code'，null，['class'=>'表单控件'，'id'=>'officers_code'，'disabled'=>'disabled']）
{！！Form:：label（'o_name'，'Officers name:'）
{！！Form:：text（'officers_name'，null，['class'=>'表单控件'，'id'=>'officers_name'，'disabled'=>'disabled']）
var name=document.getElementById（“主条目”）；
document.getElementById（“主条目”）.className=“活动”；
var slide_bar_element=document.getElementById（“bd_菜单”）；
document.getElementById（“bd_菜单”）.className=“活动”；
var slide_bar_element=document.getElementById（“bd_子菜单1”）；
document.getElementById（“bd_子菜单1”）.className=“活动”；
函数showData（x）{
$（“#myModal”）。对话框({
自动打开：正确
});
}
@端部

这应该没问题，有什么问题吗？@Pekka没有出现对话框：-（当我单击链接时没有给出任何响应。当我输入此代码时。这部分“$”（“#myModal”）。对话框（{autoOpen:true data:x；}）'显示警报框。似乎混合了bootsrttrap html和jQuery UI对话框脚本。页面中加载了哪些库资源？控制台中出现了哪些错误？从何处调用了

showData（）problem@charlietfl这是显示数据调用链接。