How to pass laravel request data to java-script if validation failed - javascript

laravel Controller
if($validator->failed())
{
return redirect()->back()->with(['errors'=>$validator->errors(),'input'=>$request]);
}
JavaScript file
<script type="text/javascript" >
var registrationErrors = #json($errors);
var input= #json($input);
</script>
In this case registrationErrors it's working fine but input return error like
Action Facade\Ignition\Http\Controllers\ExecuteSolutionController not defined.

If pass only one argument in with() function that should be work fine.
Laravel Controller
if($validator->failed())
{
$data=["errors"=>$validator->errors(),
"input" => $input
];
return redirect()->back()->with('data',$data);
}
Java Script
<script type="text/javascript" >
var data = #json($data);
</script>
My issue is solved, this way is perfectly working

Related

How to get data from jquery form builder if there are multiple form initialized on the same page

I have a code like this:
<html>
<head>
<title>Example formBuilder</title>
</head>
<body>
<div class="build-wrap"></div>
<div class="build-wrap"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script src="https://formbuilder.online/assets/js/form-builder.min.js"></script>
<script>
jQuery(function($) {
$(document.getElementsByClassName('build-wrap')).formBuilder();
});
</script>
</body>
</html>
If it was initialized by id, then I could have get data with something like this:
var fbEditor = document.getElementById('build-wrap');
var formBuilder = $(fbEditor).formBuilder();
document.getElementById('getJSON').addEventListener('click', function() {
alert(formBuilder.actions.getData('json'));
});
However, I am using classname to initialize form builder. Is there any way, when click on save, get the respective form-builder data? I am using https://formbuilder.online/
Here is jsfiddle: https://jsfiddle.net/xycvbj3r/3/
#PS: there could be numerous form builder inside php loop.
You can try this:
formBuilder.actions.getData('json');
Or:
formBuilder.actions.getData();
The live demo is here: http://jsfiddle.net/dreambold/q0tfp4yd/10/
I was facing the same issue too. This worked for me
var list = ['#ins1', '#ins2', '#ins3'];
var instances = [];
var init = function(i) {
if (i < list.length) {
var options = JSON.parse(JSON.stringify([]));
$(list[i]).formBuilder(options).promise.then(function(res){
console.log(res, i);
instances.push(res);
i++;
init(i);
});
} else {
return;
}
};
init(0);
And to get data, you can use instances[key].actions.getData()
I am not sure how you are planning to save this data, but to help with your problem of getting form data for a particular form you can use something like this
var formBuilder = $(document.getElementsByClassName('build-wrap')).first().data('formBuilder').actions.getData()
Or to use it over a jQuery Collection then
$(document.getElementsByClassName('build-wrap')).each(function () {
var formBuilder = $(this).data('formBuilder').actions.getData()
})
There is a callback mentioned in the documentation, onsave which runs on editor save. So, when clicking on any form builder's save button, the respected form's data can be received.
Here is the code-
<html>
<head>
<title>Example formBuilder</title>
</head>
<body>
<div class="build-wrap"></div>
<div class="build-wrap"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script src="https://formbuilder.online/assets/js/form-builder.min.js"></script>
<script>
jQuery(function($) {
var options = {
onSave: function(evt, formData) {
// This is the respected form's data
console.log('MY DATA_________', formData)
},
};
$(document.getElementsByClassName('build-wrap')).formBuilder(options);
});
</script>
</body>
</html>
Here is the fiddle (couldn't create a working snippet due to not working CDNs.
)- https://jsfiddle.net/nehasoni988/rpo1jnuk/1/#&togetherjs=Mka9TJ4cex

How to pass values to an external Javascript script from ASP.NET

I have a set of KPI data I need to pass over to a Javascript file from my ASP.NET project. I thought I could do so using a ViewBag... Here is what is in the controller:
public ActionResult KPI()
{
if (Session["OrganizationID"] == null)
{
return RedirectToAction("Unauthorized", "Home");
}
else
{
int orgId;
int.TryParse(Session["OrganizationID"].ToString(), out orgId);
var user = db.Users.Find(User.Identity.GetUserId());
var organization = user.Organizations.Where(o => o.OrganizationID == orgId).FirstOrDefault();
var reports = db.Reports.ToList();
try
{
var org_reports = (from r in reports
where r.OrganizationID == organization.OrganizationID
select r).ToList();
var kpi = new KPI(org_reports);
var jsonKPI = JsonConvert.SerializeObject(kpi);
ViewBag.orgData = jsonKPI;
}
catch (ArgumentNullException e)
{
return RedirectToAction("Unauthorized", "Home");
}
}
return View();
}
From the View I've tried using hidden values, and also just passing them in as parameters when calling the script:
<input type="hidden" id="orgData" value=#ViewBag.orgData>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" src="~/Scripts/KPIs.js">
orgData = #ViewBag.orgData;
</script>
I then want to read this value in my JS script and parse it into JSON from the string:
function myFunction(){
var test1 = JSON.parse(document.getElementById('orgData'); // Doesn't work
var test2 = JSON.parse(orgData); // Doesn't work
}
It doesn't appear that any of these methods are working. What is my mistake here?
You should use Html.Raw, to avoid ASP.NET to escape your value:
orgData = #Html.Raw(ViewBag.orgData);
Also, if this is a Json, it is also a valid JS object, so you don't need to parse, it already is a JS Object.
It looks like you forgot the quotes.
<input type="hidden" id="orgData" value=#ViewBag.orgData>
should be
<input type="hidden" id="orgData" value="#ViewBag.orgData">
Also the code inside your script tag will never get executed because the script tag has a src attribute on it. Code inside script tags with src attributes never gets executed.
<script type="text/javascript" src="~/Scripts/KPIs.js">
orgData = #ViewBag.orgData;
</script>
should be changed to
<script type="text/javascript" src="~/Scripts/KPIs.js" />
<script>
orgData = #ViewBag.orgData;
</script>
I solved it! Pass the KPI model through the view and then it's as easy as:
var orgData = #Html.Raw(Json.Encode(Model));
Thanks to all to offered help.

error with the injection angular.js

I have an error with my injection in the controller using angular.js
and I know that this is my problem because when I removed ngCookie the error on my console disappeared.
I have read on the web that it is ok the way i'm trying to do it - but for some reason the problem won't go away.
I tried changing the order of ngCookies and ngRoute, tried to write only one of them but I need them both, tried to change my version of angular - but still nothing work.
here is my controller
var mymedical = angular.module("mymed",['ngRoute','ngCookies']);
mymedical.controller('getPersonalCtrl',['$scope','$http',function($scope,$http) {
$http.get("http://localhost:3000/privateData").success(function(data){
$scope.insertDataToDB = data;
console.log(data);
});
}]);
mymedical.controller('insertPersonalCtrl',['$scope','$http',function($scope,$http){
var data = {};
data.email = $scope.email;
data.Tags = $scope.Tags;
data.title = $scope.title;
data.Info = $scope.Info;
data.Category = $scope.Category;
data.file = $scope.file;
data.Recommendation = $scope.Recommendation;
}]);
mymedical.controller('loginCtrl',['$scope','$http','$cookies', function($scope,$http,$cookies){
var user = {};
console.log("i'm in the controller of login");
//user.email = $scope.
//console.log($scope.email);
user.email=$scope.myemail;
user.pass = $scope.pass;
$scope.putCoockie = function(value){
var cook=$cookies.get('cookieEmail');
$cookies.put('cookieEmail',value);
console.log(value);
}
$http.post('http://localhost:3000/getUser', user).then()
}]);
how can I solve this?
Make sure you are loading the correct reference of ngCookies,
<link rel="stylesheet" href="style.css" />
<script src="//code.angularjs.org/1.2.14/angular.js"></script>
<script src="//code.angularjs.org/1.2.13/angular-route.js"></script>
<script src="//code.angularjs.org/1.2.9/angular-cookies.js"></script>
<script src="app.js"></script>
DEMO
Make sure you include ng cookies after ng route in your html page.
I am using the following in my demo project and it is working like charm.
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-route.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.0/angular-cookies.min.js"></script>
Also, can you show us the error in console?

parse html code from json using native javascript

Is it possible to get out the code that is inside a json file? You can have a look at it here: http://www.bryzgalov.directadvert.ru/show.cgi?adp=768&json=4
What is the code or method should I use to put the html code inside any raw div?
I tried to use jsonp, but there is a mistake:
unexpected token <
<script>
function myFunction(data){
var arr = JSON.parse(data);
document.getElementById('advBlock').innerHTML = arr;
}
</script>
<script type="text/javascript" src="http://www.bryzgalov.directadvert.ru/show.cgi?adp=768&json=4&callback=myFunction"></script>
The JSONP data is already a Javascript object, not a JSON string, so you don't need to parse it:
<div id="advBlock"></div>
<script>
function myFunction(data) {
document.getElementById('advBlock').innerHTML = data;
}
</script>
<script src="http://www.bryzgalov.directadvert.ru/show.cgi?adp=768&json=4&callback=myFunction"></script>
<div id="advBlock"></div>
<script src="http://www.bryzgalov.directadvert.ru/show.cgi?adp=768&json=4&callback=myFunction"></script>
<script> function myFunction(data) { document.getElementById('advBlock').innerHTML = data; } </script>
You have to add the script before your function call.

How to make the jQuery valid function work reliably on IE?

I have a problem on jQuery valid function. When on IE, it doesn't work, the valid always return true. I used this code: client side validation with dynamically added field
Here's the chart:
Chrome IE
jquery-1.6.1 works not working
jquery-1.4.4 works works
1.6 doesn't work on IE too. However, 1.4.4 jQuery valid works on IE.
Here's the jsFiddle-friendly test (test this as local html):
<!--
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8/jquery.validate.min.js" type="text/javascript"></script>
<script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>
<form id="XXX">
<input type="submit" id="Save" value="Save">
</form>
<script type="text/javascript">
// sourced from https://stackoverflow.com/questions/5965470/client-side-validation-with-dynamically-added-field
// which I do think don't have a bug
(function ($) {
$.validator.unobtrusive.parseDynamicContent = function (selector) {
//use the normal unobstrusive.parse method
$.validator.unobtrusive.parse(selector);
//get the relevant form
var form = $(selector).first().closest('form');
//get the collections of unobstrusive validators, and jquery validators
//and compare the two
var unobtrusiveValidation = form.data('unobtrusiveValidation');
var validator = form.validate();
$.each(unobtrusiveValidation.options.rules, function (elname, elrules) {
if (validator.settings.rules[elname] == undefined) {
var args = {};
$.extend(args, elrules);
args.messages = unobtrusiveValidation.options.messages[elname];
$('[name=' + elname + ']').rules("add", args);
} else {
$.each(elrules, function (rulename, data) {
if (validator.settings.rules[elname][rulename] == undefined) {
var args = {};
args[rulename] = data;
args.messages = unobtrusiveValidation.options.messages[elname][rulename];
$('[name=' + elname + ']').rules("add", args);
}
});
}
});
}
})($);
// ...sourced from others
// my code starts here...
$(function () {
var html = "<input data-val='true' " +
"data-val-required='This field is required' " + "name='inputFieldName' id='inputFieldId' type='text'/>";
$("form").append(html);
var scope = $('#XXX');
$.validator.unobtrusive.parseDynamicContent(scope);
$('#Save').click(function (e) {
e.preventDefault();
alert(scope.valid());
});
});
// ...my code ends here
</script>
UPDATE
I tried my code on jsFiddle, it has side-effect, the jQuery 1.6's valid is working on IE. Don't test this code on jsFiddle. Test this code on your local html
This problem has been solved. try version 1.8.1.
Download jQuery validation plugin
Hi I also got the same problem and I have updated my both scripts file to the latest one and everything is working very fine on my side. Go to jquery.com and check for the latest jquery code file.

Categories