templates/includes/company-home-header.html.twig line 1

Open in your IDE?
  2. {# <script src="https://pimcore.navabrinditsolutions.com/typesense-js-master/dist/typesense.js"></script> #}
  3. <script src="../../../typesense-js-master/dist/typesense.js"></script>
  4. <style>
  5.        @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600;700&display=swap');
  6.        
  7.     :root{
  8.         --orange:#ff7800;
  9.         --black:#130f40;
  10.         --light-color:#666;
  11.         --box-shadow:0 .5rem 1.5rem rgba(0,0,0,.1);
  12.         --border:.2rem solid rgba(0,0,0,.1);
  13.         --outline:.1rem solid rgba(0,0,0,.1);
  14.         --outline-hover:.2rem solid var(--black);
  15.     }
  16.        
  17.     * {
  18.     font-family: 'serif', sans-serif;
  19.     margin:0; padding:0;
  20.     box-sizing: border-box;
  21.     outline: none; border:none;
  22.     text-decoration: none;
  23.     text-transform: capitalize;
  24.     transition: all .2s linear;
  25.     }
  26.     
  27.     html{
  28.         font-size: 62.5%;
  29.         overflow-x: hidden;
  30.         scroll-behavior: smooth;
  31.         scroll-padding-top: 7rem;
  32.     }
  33.     
  34.     body{
  35.         background-color:#FCFFFE!important;
  36.     }
  37.     .companies{
  38.         background-color:#F9F9F9;
  39.     }
  40.     .home{
  41.         background-color:#F9F9F9;
  42.     }
  43.     .articles{
  44.         background-color:#F9F9F9;
  45.     }
  46.     section{
  47.         padding:2rem 9%;
  48.     }
  49.     .review{
  50.         background-color:#F9F9F9;
  51.     }
  52.     .heading{
  53.         text-align: center;
  54.         padding:2rem 0;
  55.         padding-bottom: 3rem;
  56.         font-size: 3.5rem;
  57.         color:var(--black);
  58.     }
  59.     
  60.     .heading span{
  61.         background: var(--orange);
  62.         color:#fff;
  63.         display:inline-block;
  64.         padding:.5rem 3rem;
  65.         clip-path: polygon(100% 0, 93% 50%, 100% 99%, 0% 100%, 7% 50%, 0% 0%);
  66.     }
  67.     
  68.     .btn{
  69.         margin-top: 1rem;
  70.         display: inline-block;
  71.         padding: .8rem 3rem;
  72.         font-size: 1.7rem;
  73.         border-radius: .5rem;
  74.         border:.2rem solid var(--black);
  75.         color:var(--black);
  76.         cursor:pointer;
  77.         background: none;
  78.     }
  79.     .ban{
  80.         margin-top: 1rem;
  81.         display: inline-block;
  82.         padding: .8rem 3rem;
  83.         font-size: 1.7rem;
  84.         border-radius: .5rem;
  85.         border:.2rem solid #e5871c !important;
  86.         color:#f6f4ea !important;
  87.         cursor:pointer;
  88.         background: none;
  89.     }
  90.     .btn:hover{
  91.         background: var(--orange);
  92.         color:#fff;
  93.     }
  94.     
  95.     .header{
  96.         position: relative;
  97.         top:0; left:0; right:0;
  98.         z-index: 1000;
  99.         display: flex;
  100.         align-items: center;
  101.         justify-content: space-between;
  102.         padding: 2rem 9%;
  103.         background:#fff;
  104.         box-shadow: var(--box-shadow);
  105.     }
  106.     
  107.     .header .logo{
  108.         font-size: 2.5rem;
  109.         font-weight: bloder;
  110.         color:var(--black);
  111.     }
  112.     
  113.     .header .logo i{
  114.         color:var(--orange);
  115.     }
  116.     
  117.     .header .navbar a{
  118.         font-size: 1.7rem;
  119.         margin:0 1rem;
  120.         color:var(--black);
  121.     }
  122.     
  123.     .header .navbar{
  124.         margin-right:-600px;
  125.     }
  126.     
  127.     .header .navbar a:hover{
  128.         color:var(--orange);
  129.     }
  130.     
  131.     .header .icons div{
  132.         height: 4.5rem;
  133.         width: 4.5rem;
  134.         line-height: 4.5rem;
  135.         border-radius: .5rem;
  136.         background:#eee;
  137.         color:var(--black);
  138.         font-size: 2rem;
  139.         margin-right: 1rem;
  140.         cursor: pointer;
  141.         text-align: center;
  142.     }
  143.     
  144.     .header .icons div:hover{
  145.         background: var(--orange);
  146.         color:#fff;
  147.     }
  148.     #menu-btn{
  149.         display: none;
  150.     }
  151.     
  152.     .header .search-form{
  153.         position: absolute;
  154.         top:110%; right:-110%;
  155.         width: 50rem;
  156.         height:5rem;
  157.         background:#fff;
  158.         border-radius: .5rem;
  159.         overflow: hidden;
  160.         display: flex;
  161.         align-items: center;
  162.         box-shadow: var(--box-shadow);
  163.     }
  164.     
  165.     .header .search-form.active{
  166.         right:2rem;
  167.         transition: .4s linear;
  168.     }
  169.     
  170.     .header .search-form input{
  171.         height:100%;
  172.         width:100%;
  173.         background: none;
  174.         text-transform: none;
  175.         font-size: 1.6rem;
  176.         color:var(--black);
  177.         padding:0 1.5rem;
  178.     }
  179.     
  180.     .header .search-form label{
  181.         font-size: 2.2rem;
  182.         padding-right: 1.5rem;
  183.         color:var(--black);
  184.         cursor: pointer;
  185.     }
  186.     
  187.     .header .search-form label:hover{
  188.         color:var(--orange);
  189.     }
  190.     
  191.     .header .shopping-cart{
  192.         position: absolute;
  193.         top:110%; right:-110%;
  194.         padding:1rem;
  195.         border-radius: .5rem;
  196.         box-shadow: var(--box-shadow);
  197.         width:35rem;
  198.         background: #fff;
  199.     }
  200.     
  201.     .header .shopping-cart.active{
  202.         right:2rem;
  203.         transition: .4s linear;
  204.     }
  205.     
  206.     .header .shopping-cart .box{
  207.         display: flex;
  208.         align-items: center;
  209.         gap:1rem;
  210.         position: relative;
  211.         margin:1rem 0;
  212.     }
  213.     
  214.     .header .shopping-cart .box img{
  215.         height:10rem;
  216.     }
  217.     
  218.     .header .shopping-cart .box .fa-trash{
  219.         font-size: 2rem;
  220.         position: absolute;
  221.         top:50% right:2rem;
  222.         cursor: pointer;
  223.         color:var(--light-color);
  224.         transform: translateY(-50%);
  225.     }
  226.     
  227.     .header .shopping-cart .box .fa-trash:hover{
  228.         color:var(--orange);
  229.     }
  230.     
  231.     .header .shopping-cart .box .content h3{
  232.         color:var(--black);
  233.         font-size:1.7rem;
  234.         padding-bottom:1rem;
  235.     }
  236.     
  237.     .header .shopping-cart .box .content span{
  238.         color:var(--light-color);
  239.         font-size:1.6rem;
  240.     }
  241.     
  242.     .header .shopping-cart .box .content .quantity{
  243.         padding-left: 1rem;
  244.     }
  245.     
  246.     .header .shopping-cart .total{
  247.         font-size: 2.5rem;
  248.         padding: 1rem 0;
  249.         text-align: center;
  250.         color:var(--black);
  251.     }
  252.     
  253.     .header .shopping-cart .btn{
  254.         display:block;
  255.         text-align:center;
  256.         margin:1rem;
  257.     }
  258.     
  259.     .header .login-form{
  260.         position: absolute;
  261.         top:110%; right:-110%;
  262.         width:30rem;
  263.         box-shadow: var(--box-shadow);
  264.         padding:2rem;
  265.         border-radius: .5rem;
  266.         background:#fff;
  267.         text-align:center;
  268.     }
  269.     
  270.     .header .login-form.active{
  271.         right:2rem;
  272.         transition: .4s linear;
  273.     }
  274.     
  275.     .header .login-form h3{
  276.         font-size: 2.5rem;
  277.         text-transform: uppercase;
  278.         color: var(--black);
  279.     }
  280.     
  281.     .header .login-form .box{
  282.         width: 100%;
  283.         margin:.7rem 0;
  284.         background:#eee;
  285.         border-radius: .5rem;
  286.         padding:1rem;
  287.         font-size: 1.6rem;
  288.         color:var(--black);
  289.         text-transform: none;
  290.     }
  291.     
  292.     .header .login-form p{
  293.         font-size: 1.4rem;
  294.         padding:.5rem 0;
  295.         color:var(--light-color);
  296.     }
  297.     
  298.     .header .login-form p a{
  299.        color:var(--orange);
  300.        text-decoration: underline;
  301.     }
  302.     
  303.     .home{
  304.         display: flex;
  305.         align-items: center;
  306.         justify-content: center;
  307.         background:url(https://e0.pxfuel.com/wallpapers/347/698/desktop-wallpaper-investment-and-finance-u2013-mishov-trading-stock-market-business-growth-investing-financial-market.jpg) no-repeat;
  308.         {# background: url(https://pimcore.navabrinditsolutions.com/admin/asset/get-image-thumbnail?id=99) no-repeat; #}
  309.         background-position: center;
  310.         background-size: cover;
  311.         padding-top:17rem;
  312.         padding-bottom:10rem;
  313.     }
  314.     
  315.     .home .content{
  316.         text-align: center;
  317.         width:60rem;
  318.     }
  319.     
  320.     .home .content h3{
  321.         color:#fbf6ee;
  322.         font-size: 3rem;
  323.     }
  324.     
  325.     .home .content h3 span{
  326.         color:var(--orange);
  327.     }
  328.     
  329.     .home .content p{
  330.         color:#f2ebd9;
  331.         font-size: 14px;
  332.         padding:1rem 0;
  333.         line-height: 1.8;
  334.         font-style:oblique;
  335.     }
  336.     
  337.     .companies .box-container{
  338.         display:grid;
  339.         grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));
  340.         gap:1.5rem;
  341.     }
  342.     
  343.     .companies .box-container .box{
  344.         padding:3rem 2rem;
  345.         background: #fff;
  346.         outline: var(--outline);
  347.         outline-offset: -1rem;
  348.         text-align:center;
  349.         box-shadow:var(--box-shadow);
  350.     }
  351.     
  352.     .companies .box-container .box:hover{
  353.         outline: var(--outline-hover);
  354.         outline-offset: 0rem;
  355.     }
  356.     
  357.     .companies .box-container .box img{
  358.         margin:1rem 0;
  359.         height: 15rem;
  360.     }
  361.     
  362.     img{
  363.         max-width:100%;
  364.         height:auto;
  365.         object-fit:fill;
  366.     }
  367.     
  368.     .companies .box-container .box h3{
  369.         font-size: 2.5rem;
  370.         line-height:1.8;
  371.         color:var(--black);
  372.     }
  373.     
  374.     .companies .box-container .box p{
  375.         font-size: 1.5rem;
  376.         line-height:1.8;
  377.         color:var(--light-color);
  378.         padding:1rem 0;
  379.     }
  380.     
  381.     .products .product-slider{
  382.         padding:1rem;
  383.     }
  384.     
  385.     .products .product-slider:first-child{
  386.         padding:2rem;
  387.     }
  388.     
  389.     .products .product-slider .box{
  390.         background:#fff;
  391.         border-radius: .5rem;
  392.         text-align: center;
  393.         padding:3rem 2rem;
  394.         outline-offset: -1rem;
  395.         outline: var(--outline);
  396.         outline: var(--box-shadow);
  397.         transition: .2s linear;
  398.     }
  399.     
  400.     .products .product-slider .box:hover{
  401.         outline-offset: 0rem;
  402.         outline: var(--outline-hover);
  403.     }
  404.     
  405.     .products .product-slider .box img{
  406.         height:20rem;
  407.     }
  408.     
  409.     .products .product-slider .box h3{
  410.         font-size: 2.5rem;
  411.         color:var(--black);
  412.     }
  413.     
  414.     .products .product-slider .box .price{
  415.         font-size: 2rem;
  416.         color:var(--light-color);
  417.         padding:.5rem 0;
  418.     }
  419.     
  420.     .products .product-slider .box .stars i{
  421.         font-size: 1.7rem;
  422.         color:var(--orange);
  423.         padding: .5rem 0;
  424.     }
  425.     
  426.     .categories .box-container{
  427.         display:grid;
  428.         grid-template-columns: repeat(auto-fit, minmax(26rem, 1fr));
  429.         gap:1.5rem;
  430.     }
  431.     
  432.     .categories .box-container .box{
  433.         padding:3rem 2rem;
  434.         border-radius: .5rem;
  435.         background:#fff;
  436.         box-shadow: var(--box-shadow);
  437.         outline:var(--outline);
  438.         outline-offset: -1rem;
  439.         text-align:center;
  440.     }
  441.     
  442.     .categories .box-container .box:hover{
  443.         outline:var(--outline-hover);
  444.         outline-offset: 0rem;
  445.     }
  446.     
  447.     .categories .box-container .box img{
  448.         margin:1rem 0;
  449.         height:15rem;
  450.     }
  451.     
  452.     .categories .box-container .box h3{
  453.         font-size:2rem;
  454.         color:var(--black);
  455.         line-height: 1.8;
  456.     }
  457.     
  458.     .categories .box-container .box p{
  459.         font-size: 1.7rem;
  460.         color:var(--light-color);
  461.         line-height:1.8;
  462.         padding:1rem 0;
  463.     }
  464.     
  465.     .review .review-slider{
  466.         padding:1rem;
  467.     }
  468.     
  469.     .review .review-slider .box{
  470.         background:#fff;
  471.         border-radius: .5rem;
  472.         text-align: center;
  473.         padding:3rem 2rem;
  474.         outline-offset: -1rem;
  475.         outline: var(--outline);
  476.         outline: var(--box-shadow);
  477.         transition: .2s linear;
  478.     }
  479.     
  480.     .review .review-slider .box:hover{
  481.         outline-offset: 0rem;
  482.         outline: var(--outline-hover);
  483.     }
  484.     
  485.     .review .review-slider .box img{
  486.         height:10rem;
  487.         width:10rem;
  488.         border-radius: 50%;
  489.     }
  490.     
  491.     .review .review-slider .box p{
  492.         padding:1rem 0;
  493.         line-height: 1.8;
  494.         color:var(--light-color);
  495.         font-size: 1.5rem;
  496.     }
  497.     
  498.     .review .review-slider .box h3{
  499.         padding-bottom: .5rem;
  500.         color:var(--black);
  501.         font-size: 2.2rem;
  502.     }
  503.     
  504.     .review .review-slider .box .stars i{
  505.         color:var(--orange);
  506.         font-size: 1.7rem;
  507.     }
  508.     
  509.     .articles .box-container{
  510.         display:grid;
  511.         grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));
  512.         gap:1.5rem;
  513.     }
  514.     
  515.     .articles .box-container .box{
  516.         overflow: hidden;
  517.         border-radius: .5rem;
  518.         box-shadow: var(--box-shadow);
  519.         background:#fff;
  520.     }
  521.     
  522.     .articles .box-container .box img{
  523.         height:25rem;
  524.         width:100%;
  525.         object-fit:cover;
  526.     }
  527.     
  528.     .articles .box-container .box .content{
  529.         padding:2rem;
  530.     }
  531.     
  532.     .articles .box-container .box .content .icons{
  533.         display: flex;
  534.         align-items: center;
  535.         justify-content: space-between;
  536.         padding-bottom: 1.5rem;
  537.         margin-bottom: 1rem;
  538.         border-bottom: var(--border);
  539.     }
  540.     
  541.     .articles .box-container .box .content .icons a{
  542.         color:var(--light-color);
  543.         font-size:1.5rem;
  544.     }
  545.     
  546.     .articles .box-container .box .content .icons a:hover{
  547.         color:var(--black);
  548.     }
  549.     
  550.     .articles .box-container .box .content .icons a i{
  551.         color:var(--orange);
  552.         padding-right: .5rem;
  553.     }
  554.     
  555.     .articles .box-container .box .content h3{
  556.         line-height: 1.8;
  557.         color:var(--black);
  558.         font-size: 2.2rem;
  559.         padding:.5rem 0;
  560.     }
  561.     
  562.     .articles .box-container .box .content p{
  563.         line-height: 1.8;
  564.         color:var(--light-color);
  565.         font-size: 1.5rem;
  566.         padding:.5rem 0;
  567.     }
  568.     
  569.     
  570.     .footer{
  571.         background: #fff;
  572.     }
  573.     
  574.     .footer .box-container{
  575.          display:grid;
  576.         grid-template-columns: repeat(auto-fit, minmax(25rem, 1fr));
  577.         gap:1.5rem;
  578.     }
  579.     
  580.     .footer .box-container .box h3{
  581.         font-size: 2.5rem;
  582.         color:var(--black);
  583.         padding:1rem 0;
  584.     }
  585.     
  586.     .footer .box-container .box h3 i{
  587.         color:var(--orange);
  588.     }
  589.     
  590.     .footer .box-container .box .links{
  591.         display: block;
  592.         font-size: 1.5rem;
  593.         color:var(--light-color);
  594.         padding:1rem 0;
  595.     }
  596.     
  597.     .footer .box-container .box .links i{
  598.         color:var(--orange);
  599.         padding-right: .5rem;
  600.     }
  601.     
  602.     .footer .box-container .box .links:hover i{
  603.         padding-right: 2rem;
  604.     }
  605.     
  606.     .footer .box-container .box p{
  607.         line-height:1.8;
  608.         font-size: 1.5rem;
  609.         color:var(--light-color);
  610.         padding:1rem 0;
  611.     }
  612.     
  613.     .footer .box-container .box .share a{
  614.         height:4rem;
  615.         width:4rem;
  616.         line-height:4rem;
  617.         border-radius: .5rem;
  618.         font-size: 2rem;
  619.         color:var(--black);
  620.         margin-left: .2rem;
  621.         background:#eee;
  622.         text-align: center;
  623.     }
  624.     
  625.     .footer .box-container .box .share a:hover{
  626.         background:var(--orange);
  627.         color:#fff;
  628.     }
  629.     
  630.     .footer .box-container .box .email{
  631.         width:100%;
  632.         margin:.7rem 0;
  633.         padding:1rem;
  634.         border-radius: .5rem;
  635.         background: #eee;
  636.         font-size: 1.6rem;
  637.         color:var(--black);
  638.         text-transform:none;
  639.     }
  640.     
  641.     .footer .box-container .box .payment-img{
  642.         margin-top: 2rem;
  643.         height:5rem;
  644.     }
  645.     
  646.     .footer .credit{
  647.         text-align:center;
  648.         margin-top: 2rem;
  649.         padding:1rem;
  650.         padding-top: 2.5rem;
  651.         font-size:2rem;
  652.         color:var(--black);
  653.         border-top: var(--border);
  654.     }
  655.     
  656.     .footer .credit span{
  657.         color:var(--orange);
  658.     }
  659.     
  660.     
  661.    
  662.         
  663.     
  664.     
  665.     /*media queries*/
  666.     @media (max-width:991px){
  667.         html{
  668.             font-size:55%;
  669.         }
  670.         
  671.         .header{
  672.             padding:2rem;
  673.         }
  674.         
  675.         section{
  676.         padding:2rem;
  677.     }
  678.     }
  679.     
  680.     @media (max-width:768px){
  681.         
  682.         #menu-btn{
  683.             display: inline-block;
  684.         }
  685.         
  686.         .header .search-form{
  687.             width:90%;
  688.         }
  689.         
  690.         .header .navbar{
  691.             position: absolute;
  692.             top:110%; right:-110%;
  693.             width:30rem;
  694.             box-shadow: var(--box-shadow);
  695.             border-radius: .5rem;
  696.             background:#fff;
  697.         }
  698.         
  699.         .header .navbar.active{
  700.            right:2rem;
  701.            transition: .4s linear;
  702.         }
  703.         
  704.         .header .navbar a{
  705.             font-size: 2rem;
  706.             margin:2rem 2.5rem;
  707.             display: block;
  708.         }
  709.     }
  710.     
  711.     @media (max-width:450px){
  712.         html{
  713.             font-size:50%;
  714.         }
  715.         
  716.         .heading{
  717.             font-size:2.5rem;
  718.         }
  719.         
  720.         .footer{
  721.             text-align:center;
  722.         }
  723.     }
  724.     .head-active{
  725.         color:orange!important;
  726.     }
  727.     .dropdown-content {
  728.         display: none;
  729.         position: absolute;
  730.         background-color: #F6F6FC;
  731.         min-width: 160px;
  732.         box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  733.         z-index: 1;
  734.         margin-left: 340px;
  735.         margin-top: 4px;
  736.         margin-right: 5px;
  737.         }
  738.     .dropdown-content li {
  739.         color: black;
  740.         padding: 12px 16px;
  741.         text-decoration: none;
  742.         display: block;
  743.     }
  744.     #search-input{
  745.         background-color: #EBEBF8;
  746.         width: 230px;
  747.         height: 35px;
  748.         padding: 5px;
  749.         margin-right: 186px;
  750.     }
  751.     .dropdown-content li a{
  752.         font-size : 12px!important;
  753.     }
  754. </style>
  756. <header class="header">
  757.             <a href="https://pimcore.navabrinditsolutions.com/" class="logo"><i class="fas fa-shopping-basket" style="padding-right:5px";></i>News Repos</a>
  758.             <nav class="navbar">
  759.                 <a class="head-menu" id="Home" href="/Companies/Home">home</a>
  760.                 <a class="head-menu" id="Companies" href="/Companies/Companies">companies</a>
  761.                 <a class="head-menu" id="Articles" href="/Companies/Articles">articles</a>
  762.                 <a class="head-menu" id="RatingsReviews" href="/Companies/RatingsReviews">reviews</a>
  763.                 <input id="search-input" type="text" name="search" placeholder="search companies" onkeyup="search()">
  764.                 <div id="search-results" class="dropdown-content" style="display:none;"></div>
  765.             </nav>
  766.             
  767.             <div class="icons">
  768.                 <div class="fas fa-bars" id="menu-btn"></div>
  769.                 
  770.             </div>
  771.             
  772.         </header>
  774. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
  775. <script>
  776. var typesense = new Typesense.Client({
  777.     'nodes': [
  778.       {
  779.         'host': 'nkmw3sb1yz6qu7c2p-1.a1.typesense.net',
  780.         'port': '443',
  781.         'protocol': 'https'
  782.       }],
  783.     'apiKey': 'GY4g1NiCxQ0n757pXqcUdONtSnIRyhMX',
  784.     'numRetries': 3, // A total of 4 tries (1 original try + 3 retries)
  785.     'connectionTimeoutSeconds': 10,
  786.     'retryIntervalSeconds': 0.1,
  787.     'healthcheckIntervalSeconds': 2,
  788.     'logLevel': 'debug'
  789.   })
  791.   
  792.   
  793. var enable;
  794. $.ajax({
  795.         type: "GET",     
  796.         url: 'https://pimcore.navabrinditsolutions.com/api/companies/v1/enable',
  797.         async: false,
  798.         "success":function(resdata){
  799.             enable = resdata.message;
  800.         }
  801.     });
  802.      var path = window.location.href; 
  803.     $('.navbar a').each(function() {
  804.         //alert(this.href);
  805.         if (this.href === path) {
  806.             jQuery(this).addClass('head-active');
  807.         }
  808.     });
  810. console.log(enable);
  811. function search () {
  812.     var searchTerm = document.getElementById('search-input').value
  813.     if(searchTerm != ''){
  814.         if(enable == true){
  815.             typesense.collections('news_repos').documents().search({
  816.                 'q': searchTerm,
  817.                 'query_by': ['company_name','country','city','state']
  818.             }).then(function (searchResults) {
  819.                 var keys = Object.keys(searchResults.hits).length;
  820.                 var i=0;
  821.                 var results='';
  822.                 for(i=0; i < keys; i++){
  823.                     //console.log(searchResults.hits[i].document.id);
  824.                     var hrefurl = "https://pimcore.navabrinditsolutions.com/companyDetails?id="+searchResults.hits[i].document.id;
  825.                     console.log(hrefurl); 
  826.                     results += '<li><a href='+hrefurl+'>'+ searchResults.hits[i].document.company_name +'</a></li>';
  827.                 }
  828.                 $('#search-results').show();
  829.                 $('#search-results').html(results);
  830.             }).catch(function (error) {
  831.                 document.getElementById('search-results').innerHTML = error
  832.             })
  833.         }else{
  834.             $.ajax({
  835.                 type: "POST",     
  836.                 url: 'https://pimcore.navabrinditsolutions.com/api/companies/v1/search',
  837.                 data: {searchTerm : searchTerm},
  838.                 "success":function(resdata){
  839.                     console.log(resdata);
  840.                     var keys = Object.keys(resdata.message).length;
  841.                     console.log(keys);
  842.                     var i=0;
  843.                     var results='';
  844.                     if(keys > 0){
  845.                         for(i=0; i < keys; i++){
  846.                             var id = resdata.message[i].company_id;
  847.                             var hrefurl = "https://pimcore.navabrinditsolutions.com/companyDetails?id="+id;
  848.                             //console.log(resdata.message[i].company_id); 
  849.                             results += '<li><a href='+hrefurl+'>'+ resdata.message[i].company_name +'</a></li>';
  850.                             
  851.                         }
  852.                         $('#search-results').show();
  853.                             $('#search-results').html(results);
  854.                     }
  855.                 }
  856.             });
  857.         }
  858.     }else{
  859.         $('#search-results').hide();
  860.     }
  861.     
  862.   }
  863. </script>