laravel-5 passing variable to JavaScript

Question

is there any ways that JavaScript can get the variable from compact controller Laravel-5   Example  I have the code below       langs   Language  all       return View  make  NAATIMockTest Admin Language index  compact  langs       Can I get this langs and pass it to JavaScript  I already used PHP-Vars-To-Js-Transformer  But when I use JavaScript  put for two functions in the controller  It didn t work  Any help   This is my code by using PHP-Vars-To-Js-Transformer   LanguageController  This is my create and edit function    public function create                       names    this- gt initLang              Javascript  put                langs    gt   names                              return View  make  NAATIMockTest Admin Language create  compact  names                public function edit  id                               lang   Language  findOrFail  id              names    this- gt initLang              Javascript  put                langs    gt   names                              return View  make  NAATIMockTest Admin Language edit   compact  lang                   return View  make  NAATIMockTest Admin Language edit             this is my View create     extends  AdLayout         section  content       lt   script type  text javascript  gt        var app   angular module  myApp              app controller  langCtrl   function  scope               scope languages   langs                lt  script gt       lt div class  container-fluid  ng-app  myApp  ng-controller  langCtrl  gt         lt div class  row  gt           lt div class  col-md-8 col-md-offset-2  gt               lt div class  panel panel-default  gt                   lt div class  panel-heading  gt                       lt h2 gt Create language                      lt  h2 gt                   lt  div gt                    lt div class  panel-body  gt                          Form  open                                lt p class  text-center  gt                                  Form  label  Name   Language                                      lt input type  text  name  searchLanguage  ng-model  searchLanguage  gt                           lt  p gt                            lt select name  Name    multiple size  10  ng-model  lang  ng-click  show    gt                               lt option value     v    ng-repeat   k v  in languages   filter searchLanguage  gt                                     v                                lt  option gt                           lt  select gt  lt br gt                            lt div class  text-center  gt                                  Form  submit  Create    class   gt  btn btn-primary        amp nbsp                                      Html  linkAction  NAATIMockTest LanguageController index    Back   null  array  class    gt   btn btn-primary                                 lt  div gt                          Form  close                        lt  div gt               lt  div gt           lt  div gt       lt  div gt       lt  div gt      endsection   This is my View edit     extends  AdLayout        section  content        lt script type  text javascript  gt       var app   angular module  myApp            app controller  langCtrl   function  scope             scope languages   langs              lt  script gt       lt div class  container-fluid  ng-app  myApp  ng-controller  langCtrl  gt          lt div class  row  gt             lt div class  col-md-8 col-md-offset-2  gt                 lt div class  panel panel-default  gt                   lt div class  panel-heading  gt  lt h2 gt Edit      lang- gt id   lt  h2 gt  lt  div gt                   lt div class  panel-body  gt                          Form  model  lang                                  Form  label  Name   Language         amp nbsp     lang- gt Name                             lt  --     Form  text  Name  null   disabled        lt br gt  -- gt                              Form  hidden  id       lt input type  text  name  searchLanguage  ng-model  searchLanguage  gt                           lt  p gt                            lt select name  Name    size  10  gt                               lt option value     v    ng-repeat   k v  in languages   filter searchLanguage  gt                                     v                                lt  option gt                           lt  select gt  lt br gt                           lt div class  text-center  gt                                  Form  submit  Update    class   gt  btn btn-info        amp nbsp                                  Html  linkAction  NAATIMockTest LanguageController index    Back   null  array  class    gt   btn btn-primary                                 lt  div gt                          Form  close                        lt  div gt               lt  div gt           lt  div gt       lt  div gt      lt  div gt      endsection   my javascript php in config folder     lt  php      return                --------------------------------------------------------------------------       View to Bind JavaScript Vars To      --------------------------------------------------------------------------             Set this value to the name of the view  or partial  that       you want to prepend all JavaScript variables to                    bind js vars to this view    gt   footer        bind js vars to this view    gt   NAATIMockTest Admin Language create        bind js vars to this view    gt   NAATIMockTest Admin Language edit                --------------------------------------------------------------------------       JavaScript Namespace      --------------------------------------------------------------------------             By default  we ll add variables to the global window object  However        it s recommended that you change this to some namespace - anything        That way  you can access vars  like  SomeNamespace someVariable                     js namespace    gt   window         The idea is  I have a table language in mysql  I want to show the dropdown list with multiple attributes to choose  and I also want to search with angularjs as well  That s why I want to pass the variable from the controller to JavaScript  Additionally  I have the function inside LanguageController called initLang to check if any language is exist inside the database  it isn t displayed inside the dropdown list in create the view

User · Answer

langs   Language  all  - gt toArray    return View  make  NAATIMockTest Admin Language index          langs    gt   langs       then in view   lt script type  text javascript  gt      var langs     json encode  langs         console log langs    lt  script gt    Its not pretty tho

User · Answer

Try this - https   github com laracasts PHP-Vars-To-Js-Transformer Is simple way to append PHP variables to Javascript

User · Answer

Is very easy  I use this code   Controller    langs   Language  all  - gt toArray    return view  NAATIMockTest Admin Language index   compact  langs       View    lt script type  text javascript  gt      var langs    lt  php echo json decode  langs     gt       console log langs    lt  script gt    hope it has been helpful  regards

User · Answer

The best way for me was to put it in a hidden div in php blade  lt div hidden id  quot token quot  gt    token   lt  div gt   then call it in javascript as a constant to avoid undefined var errors const token   document querySelector  div id token    textContent     console log token     eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9 eyJhdWQiOiI5MjNlOTcyMi02N2NmLTQ4M2UtYTk4Mi01YmE5YTI0Y2M2MzMiLCJqdGkiOiI2Y2I1ZGRhNzRhZjNhYTkwNzA3ZjMzMDFiYjBiZDUzNTZjNjYxMGUyZWJlNmYzOTI5NzBmMjNjNDdiNjhjY2FiYjI0ZWVmMzYwZmNiZDBmNyIsImlhdCI6IjE2MDgwODMyNTYuNTE2NjE4IiwibmJmIjoiMTYwODA4MzI1Ni41MTY2MjUiLCJleHAiOiIxNjIzODA4MDU2LjMxMTg5NSIsInN1YiI6IjUiLCJzY29wZXMiOlsiYWRtaW4iXX0 GbKZ8CIjt3otzFyE5aZEkNBCtn75ApIfS6QbnD6z0nxDjycknQaQYz2EGems9Z3Qjabe5PA9zL1mVnycCieeQfpLvWL9xDu9hKkIMs006Sznrp8gWy6JK8qX4Xx3GkzWEx8Z7ZZmhsKUgEyRkqnKJ-1BqC2tTiTBqBAO6pK Pz7H74gV95dsMiys9afPKP5ztW93kwaC-pj4h-vv-GftXXc6XDnUhTppT4qxn1r2Hf7k-NXE IHq4ZPb20LRXboH0RnbJgq2JA1E3WFX5 a6FeWJvLlLnGGNOT0ocdNZq7nTGWwfocHlv6pH0NFaKa3hLoRh79d5KO nysPVCDt7jYOMnpiq8ybIbe3oYjlWyk rdQ9067bnsfxyexQwLC3IJpAH27Az8FQuOQMZg2HJhK8WtWUph5bsYUU0O2uPG8HY9922yTGYwzeMEdAqBss85jdpMNuECtlIFM1Pc4S-0nrCtBE tNXn8ATDrm6FecdSK8KnnrCOSsZhR04MvTyznqCMAnKtN vMDpmIAmPd181UanjO kxR7QIlsEmT UhM1MBmyfdIEvHkgLgUdUouonjQNvOKwCrrgDkP0hkZQff-iuHPwpL-CUjw7GPa70lp-TIDhfei8T90RkAXte1XKv7ku3sgENHTwPrL9QSrNtdc5MfB9AbUV-tFMJn9T7k

User · Answer

One working example for me    Controller     public function tableView          sites   Site  all        return view  main table   compact  sites         View    lt script gt          var sites       json encode  sites- gt toArray          lt  script gt    To prevent malicious   unintended behaviour  you can use JSON HEX TAG as suggested by Jon in the comment that links to this SO answer   lt script gt          var sites       json encode  sites- gt toArray    JSON HEX TAG        lt  script gt

User · Answer

Standard PHP objects  The best way to provide PHP variables to JavaScript is json encode  When using Blade you can do it like following    lt script gt      var bool       json encode  bool           var int       json encode  int                         var array       json encode  array without keys           var object       json encode  array with keys           var object       json encode  stdClass        lt  script gt     Displaying unescaped data - Laravel docs json encode - PHP docs    There is also a Blade directive for decoding to JSON  I m not sure since which version of Laravel but in 5 5 it is available  Use it like following    lt script gt      var array    json  array    lt  script gt     Blade Templates - Laravel 5 5 docs   Jsonable s  When using Laravel objects e g  Collection or Model you should use the - gt toJson   method  All those classes that implements the  Illuminate Contracts Support Jsonable interface supports this method call  The call returns automatically JSON    lt script gt      var collection        collection- gt toJson            var model        model- gt toJson         lt  script gt    When using Model class you can define the  hidden property inside the class and those will be filtered in JSON  The  hidden property  as its name describs  hides sensitive content  So this mechanism is the best for me  Do it like following   class User extends Model                      protected  hidden              password    ip address                                        And somewhere in your view   lt script gt      var user        user- gt toJson         lt  script gt     Serializing to JSON - Laravel docs

User · Answer

Let s say you have a collection named  services that you are passing to the view    If you need a JS array with the names  you can iterate over this as follows    lt script gt      const myServices            foreach   services as  service          myServices push      service- gt name            endforeach  lt  script gt    Note  If the string has special characters  like    or HTML code   you can use      service- gt name       If you need an array of objects  with all of the attributes   you can use    lt script gt    const myServices    json  services             lt  script gt    Note  This blade directive  json is not available for old Laravel versions  You can achieve the same result using json encode as described in other answers     Sometimes you don t need to pass a complete collection to the view  and just an array with 1 attribute  If that s your case  you better use  services   Service  pluck  name    in your Controller

[javascript] laravel-5 passing variable to JavaScript

Examples related to javascript

Examples related to laravel

Examples related to laravel-5