Laravel angularjs configuration - php

I try to include Angularjs in Laravel but i don't know what mistake i made i got error
Use of undefined constant name - assumed 'name'
myHead.blad.php
<title>Title</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/angular-route/angular-route.min.js"></script>
<script type="text/javascript" src="app.js"></script>
<script type="text/javascript" src="controllers/homeController.js"></script>
<script type="text/javascript" src="controllers/aboutController.js"></script>
myWelcome.blade.php
<!DOCTYPE html>
<html ng-app="MyApp">
<head>
<?php echo View::make('layouts/head'); ?>
</head>
<body>
<?php echo View::make('layouts/header'); ?>
<div ng-controller="HelloController">Hi {{name}} welcome to AngularJS Tutorial Series</div>
<button class="btn" name="test" value="test">Test</button>
</body>
<?php echo View::make('layouts/footer'); ?>
</html>
Hellocontroller.js
MyApp.controller('HelloController', hello);
function hello($scope)
{
$scope.name = "Test";
}
Please tell me how to configure Angularjs in Laravel

interpolated expression need to change if you want to work with laravel because laravel and angular js both use same {{}} interpolation symbol for expression exicuition
Add the code where you define your app
var MyApp = angular.module('MyApp', [])
MyApp.config(function($interpolateProvider) {
$interpolateProvider.startSymbol('<%');
$interpolateProvider.endSymbol('%>');
});
myWelcome.blade.php
<!DOCTYPE html>
<html ng-app="MyApp">
<head>
<?php echo View::make('layouts/head'); ?>
</head>
<body>
<?php echo View::make('layouts/header'); ?>
<div ng-controller="HelloController">Hi <%name%> welcome to AngularJS Tutorial Series</div>
<button class="btn" name="test" value="test">Test</button>
</body>
<?php echo View::make('layouts/footer'); ?>
</html>

Kindly Check into your code the issue persist with injection due to which your code was not working, it's working with your code, please have a look
(function(angular) {
'use strict';
var myApp = angular.module('MyApp', []);
myApp.controller('HelloController', function($scope) {
$scope.name = 'Test';
});
})(window.angular);
https://plnkr.co/edit/30nM20o7MHrxPifVu9Ig?p=preview

Related

Fullcalendar not rendering in Laravel

Route:
Route::get('/calendar/{id}', 'TasksController#showcalendar')->name('cal');
Function:
public function showcalendar($id)
{
// $tasks = Task::where('halls_id', '=', '1')->get();
return view('tasks.test');
}
test.blade.php
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='utf-8' />
<link href='fullcalendar/main.css' rel='stylesheet' />
<script src='fullcalendar/main.js'></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
initialView: 'dayGridMonth'
});
calendar.render();
});
</script>
</head>
<body>
<div id='calendar'></div>
<h1> Test</h1>
</body>
</html>
fullcalendar/main.css and main.js are both in the public/fullcalendar folder, using the newest library and literally just copy pasted what the website showed as an example... Honestly not sure what I am missing
Going to /calendar/1 it shows a blank page except for the H1 words "Test"
Using laravel 5.4.36
use {{ URL::asset() }} while you called css and js
<link href='{{ URL::asset('fullcalendar/main.css') }}' rel='stylesheet' />
<script src='{{ URL::asset('fullcalendar/main.js') }}'></script>

PHP AJAX issue with divs

having a few issues at the moment regarding updating the content of a div using ajax and php. I am trying to echo the price in the php script into to the div and it is not happening....maybe I'm missing something. This is a modified and simplified example of my problem.
HTML CODE:
<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
function autoRefresh_div(){
$("#tester").load("getPriceTest.php");
}
setInterval('autoRefresh_div()', 1000);
</script>
<body>
<div id="tester">3.33</div>
</body>
</html>
PHP CODE:
<?php
echo "2.22";
?>
Put the function in without the ', or change it to:
<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
function autoRefresh_div(){
$("#tester").load("getPriceTest.php");
}
setInterval(function(){
autoRefresh_div()
}, 1000);
</script>
<body>
<div id="tester">3.33</div>
</body>
</html>

how to make php variables show in loaded content

tried to ask this question earlier but made a total mess of it. so thought i'd try it again but clearer this time.
how can you get php variables to display in loaded content using JQuery?
index.php:
<!doctype html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script>
$(document).ready(function(){
$('#clickMe').click(function(){
$('#parent').load('loaded.php #child', {},function(){
});
});
});
</script>
</head>
<?php
session_start();
$test = "this should display php string";
$_SESSION['another'] = "Session variable String";
echo ' tests to see if they work below <br>';
echo $test."<br>";
echo $_SESSION['another']."<br><br>";
?>
<button name="clickMe" id="clickMe" class="clickMe">Click me</button>
<div class="parent" name="parent" id="parent" style="background-color:yellow; height:200px; width:200px;">
</div>
<body>
</body>
</html>
loaded.php:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<div name="child" id="child" class="child">
<p1> html loads fine..</p1><br>
<?php echo $test ?><br>
<?php echo $_SESSION['another'] ?>
</div>
</body>
</html>
As stated by #Fred -ii- in the comments, you only have to fetch the session in your index.php file to do this.
If you want to get a part of another web page inside index.php :
Your index.php should contain this call :
$(document).ready(function(){
$('#clickMe').click(function(){
$('#parent').load('loaded.php'); // No need for additional parameters
});
});
You don't need to select a part of the HTML, return just what you need :
loaded.php :
<?php session_start() ?>
<p>Example text</p>
<?php echo $_SESSION['another'] ?>

how to transfer jquery data between iframes

So I have two iframes in page
<div id="ch">
<iframe name="users" width="220" height="510" align="left" src='messages/users.php' id="userch" ></iframe>
<iframe name="text" width="450" height="405" src='messages/text.php'></iframe>
</div>
So I have variables in first iframe and I need to sent them into second iframe. I tried to use method GET. But any method that will work is good.
so first iframe
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8">
<meta content="10; url=users.php" HTTP-EQUIV=Refresh>
<meta content="utf-8" http-equiv="encoding">
<link href="../css/chat.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="../js/jquery-2.1.3.js"></script>
<script type="text/javascript" src="../js/ch_users.js"></script>
</head>
<body >
<div class="ess_contact">
<div>
</body>
</HTML>
2-nd iframe
<html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<meta content="utf-8" http-equiv="encoding">
<meta content="5; url=text.php?active=<?=$active;?>" HTTP-EQUIV=Refresh>
</head>
<body onload="scroll(0,100)" link="blue" alink="blue" vlink="blue">
<font size=3 face="Georgia">
<?php
if (isset($_GET['active']))
{
$active=$_GET['active'];
echo $active;
}
?>
</body>
</html>
and js file
jQuery.noConflict();
jQuery(document).ready(function($) {
$(document).on('click','.ess_contact', function () {
var active = this.id;
$.get( "text.php", { active: active} );
});
});
Since you are already using PHP, you can start a session using session_start() and pass all your data through session variables.
Set:
$_SESSION['myvar']="the data";
Read:
if(isset($_SESSION['myvar'])){
echo $_SESSION['myvar'];
}
Using the above, you can use GET or POST to transfer data across php pages. Unless you really have the restriction to use JQuery.
I tried transferring data between iframes, and this is how I did it.
Main.html
<html>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<body>
<h2>Iframe data test</h2><br/>
<h2>Iframe 1</h2>
<iframe src="f1.html" id="frame1"></iframe>
<br/>
<br/>
<h2>Iframe 2</h2>
<iframe src="f2.html" id="frame2"></iframe>
</body>
</html>
f1.html
<html>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<body>
<h2>Iframe 1 here</h2><br/>
<input type="text" id="mydata"/><br/>
<input type="button" id="send" value="send data"/>
</body>
<script>
$(document).ready(function(){
$("#send").click(function(){
parent.$("#frame2").contents().find("#target").html($("#mydata").val());
});
});
</script>
</html>
f2.html
<html>
<body>
<h2>Iframe 2 here</h2><br/>
<div id="target"></div>
</body>
</html>
You see the two iframes on the Main page. Type anything in the textbox and click Send data, the contents of the textbox will be set in a div found in the second iframe.
Here i used AJAX. It's nearer to your code.
Here i created a jQuery.
This is the index.php file.
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="jquery-1.11.2.min.js"></script>
<script src="t.js"></script>
</head>
<body>
<h1>Below is iframe</h1>
<iframe name="users" width="220" height="510" align="left" src='2.php' id="userch" ></iframe>
<iframe name="text" width="450" height="405" src='3.php' class="f3"></iframe>
</body>
</html>
Here is frame 1. Name 2.php;
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="jquery-1.11.2.min.js"></script>
<script src="t.js"></script>
</head>
<body>
<h2>Hello Milan from frame 2</h2>
<h2>hello</h2>
<h2>world!</h2>
</body>
</html>
Here is frame 2. Name:3.php
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="jquery-1.11.2.min.js"></script>
<script src="t.js"></script>
</head>
<body>
<h2>Hello Milan from frame 3</h2>
<div class="msg"></div>
<?php
if(isset($_REQUEST['active']))
{
echo $_REQUEST['active'];
}
?>
</body>
</html>
And here is a jQuery named t.js.
function ifrm(){
$(document).ready(function (){
$("h2").click(function (){
var r=$(this).text();
$.ajax({url:"3.php",data:{active:r},success: function (data) {
parent.$('.f3').contents().find('.msg').html(data);
}});
});
});
}
ifrm();
Click on any text in 2.php file and you can see what's going on in 3.php.

PHP/jQuery - getting html tag <title>xxx</title> content

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>SOMETITLE</title>
</head>
<body>
click
</body>
</html>
I want to use php/jQuery to get the content under <title></title> and place it to XXX at <a href="http://www.facebook.com/sharer.php?u=<?php echo $url ?>&t=XXX">, how to do it?
Updated 2
<?php
$url = (!empty($_SERVER['HTTPS'])) ? "https://".$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'] : "http://".$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'];
?>
<div id="language">
<ul>
<li class="last">
<span><a id="block-header-facebook" href="http://www.facebook.com/sharer.php?u=<?php echo $url ?>&t=link"><img src="/home/images/icon/facebook.jpg" /></a></span><span><img src="/home/images/icon/twitter.jpg" /></span></li>
</ul>
</div>
<script>
$('#block-header-facebook').attr('href').replace("link", "hi");
</script>
Thanks you
Use jQuery (just change the selector $("a") to be more specific, using an id or a class):
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>SOMETITLE</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("a").each(function() {
$(this).attr("href",
$(this).attr("href").replace("XXX", $("html head title").text())
);
});
});
</script>
</head>
<body>
click
</body>
</html>
For the Update 2, change the script element:
<script type="text/javascript">
$('#block-header-facebook').each(function() {
$(this).attr('href', $(this).attr('href').replace("link", document.title));
});
</script>
By the way I do too recommend using the Ralph's server approach (use this only if you need to do it on the client).
Added Recommendation (See Ralph comment)
Change the a-tag and script to:
<a id="block-header-facebook" href="http://www.facebook.com/sharer.php?u=<?php echo $url ?>">
<script type="text/javascript">
$('#block-header-facebook').each(function() {
$(this).attr('href', $(this).attr('href') + "&t=" + escape(document.title));
});
</script>
Less error-prone code, and I will work the same.
there is a simple function that you can use at this page
http://www.phpro.org/examples/Get-Text-Between-Tags.html
Or with JavaScript:
var link = document.getElementsByTagName("a")[0].href;
link = link.replace(/&t=.+$/, "&t=" + document.title);
document.getElementsByTagName("a")[0].href = link;
<?php
$title = 'SOMETITLE';
?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?php echo $title ?></title>
</head>
<body>
click
</body>
</html>
I think it's always preferable to do it server-side if you can. Less computation for the client, less JS dependency/cross-browser issues, and no "lag time".
Urlencoding isn't necessary in this example, but it will be if your title has spaces and other weird characters in it.

Categories