JavaScript

123K

Solutions

42K

Contributors

JavaScript is a dynamic, object-based language commonly used for client-side scripting in web browsers. Recently, server side JavaScript frameworks have also emerged. JavaScript runs on nearly every operating system and  in almost every mainstream web browser.

Share tech news, updates, or what's on your mind.

Sign up to Post

Hi,

I'm having problem sending "Json" data to a text editor

Can you please help?

 $("#SelectAFunctionFromList").change(function (event) {
            debugger;
            var GetValue = $(this).val();
            $('#HiddenFieldForSelectedFunctionID').val(GetValue);
            //reset select group
           // $('#FunctionTextArea').val("");
            var method = $('#FunctionPartialViewForm').attr("method").toLowerCase();
            var action = $('#FunctionPartialViewForm').attr("action");
            var data = $('#FunctionPartialViewForm').serialize();
            $.ajax({ method: method, url: action, data: data }).done(
                function (json) {

                  //Here I want to send my json data to my text editor called "FunctionTextArea" 
                    alert(json);
                    editor .value =  $("#FunctionTextArea").val(json);


                });
        });




      jQuery(function () {
            var editor = new Jodit("#FunctionTextArea");
        });

Open in new window

0
Exploring SQL Server 2016: Fundamentals
LVL 19
Exploring SQL Server 2016: Fundamentals

Learn the fundamentals of Microsoft SQL Server, a relational database management system that stores and retrieves data when requested by other software applications.

My site gets a cookie error in the console:

I use a plug-in called:
http://3dflipbook.net/


I decided to Inspect the page and found these errors...

===
query-migrate.min.js?ver=1.4.1:2

JQMIGRATE: Migrate is installed, version 1.4.1

A cookie associated with a cross-site resource at http://www.pagespeed-mod.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
pdf.worker.js:1

The provided value 'moz-chunked-arraybuffer' is not a valid enum value of type XMLHttpRequestResponseType.
e @ pdf.worker.js:1

====

This is a new site, but I am not promoting it yet. I have no Terms of Use, but plan to do that. I guess what I can conclude from this error is that the plug-in (mention above) uses a cookie.

What shall I do about this error? What does it mean?

Thanks
0
Hi,

i want to replace \n with </br>


 My original code is this: 

      var text = $("#ContidionsAndAttributesTextArea").val());
            alert(text); 
            editor.value = editor.value + text;


but I want to replace \n with <br/> 

            var text = $("#ContidionsAndAttributesTextArea").val().replace("\n", "<br />", "g");     //it's only replacing the first \n but not any \n found in the field
            alert(text); 
            editor.value = editor.value + text;

Open in new window


my output text is this:

"<br />IF Dx <> Dx2 (1237)  \n AND Px Range (22 - 333) "

It replace my first \n with <br> but not the second \n
0
Hi,
I have a main form displaying data.  Then I have a "Comments" link on each row and on the click of it a partial view with a table opens up.  The partial view is to view/add comments and other data.  In this partial view, after the table, there are textboxes I can fill with data.  After adding data I click on "Add" and when I am done I would click on "Save" and whatever I typed in the textboxes is entered in the database.  This all works and gives you an idea of what I am working with(see attached pics as well).  

What I am looking for now is a way to fill the Ticket Number textbox(on the partial view) with the number from the Number field(on main form).  Also, this number should not be edited on the partial.  How can I achieve that?

I have been unable to find a solution.  Please help.  Thank you.

THIS IS THE CODE IN THE CONTROLLER:
//VIEW ALL COMMENTS AND DISPLAY IN PARTIAL
        [HttpPost]
        public ActionResult ViewComments(int ticketNum)
        {
            List<Comment> AllComments = new List<Comment>();
            using (DBModel db = new DBModel())
                AllComments = db.Comments.Where(x => x.TicketNumber == ticketNum).ToList();

            return PartialView("ViewComments", AllComments);
        }


//INSERT COMMENT
        public JsonResult InsertComments(List<Comment> commentsArray)
        {
            using (DBModel db = new DBModel())
            {
                //Truncate Table to delete all comments. 

Open in new window

0
Hello,

How can I transfer data from the dialog box to the parent window?

I need your help.

I have a parent window and a popup window

1. user open popup window
2. the popup window has a textarea
3. the values that are in the textarea needs to go back to the parent textarea.

I don't know what I'm doing wrong.

Text area in the parent window: 

 @Html.TextArea("ConditionAttributesAndValues", new { @class = "form-control", @style = "width:77%" })

My dialog box in the parent window:

$(function () {
            $('#dialog').dialog({
                autoOpen: false,
                width: 950,
                height:650,
                resizable: true,
                title: 'Condition',
                modal: true,
                open: function(event, ui) {
                    $(this).load("@Url.Action("RulePartialView", "CareAdvanceBusinessRules")")
                    $(".ui-dialog-titlebar-close").hide();
                },
                buttons: {
                    "Close": function () {
                        $(this).dialog("close");
                    }
                },
                closeOnEscape: false,
            });
            $("#opener").click(function (event) {
                event.preventDefault(); 
                $("#dialog").dialog("open");
            });
        });

Open in new window


This is what I have in the dialog box: 

// Here where I need the help 
// I want what ever I have in the textarea to be sent to the parent textarea. 

     $("#AppendConditionToParentBtn").click(function () {
            $('#ContidionsAndAttributesTextArea').text(window.opener.$("#ConditionAttributesAndValues").val());
            $('#dialog').dialog('close');
            return true;
        });

 <button id="AppendConditionToParentBtn" name="AppendConditionToParentBtn" class="btn btn-default" type="button" style="margin-top:10px;margin-bottom:10px;" value="Append">
                        Submit 
                    </button>

Open in new window


I'm getting this error

Unhandled exception at line 513, column 13 in eval code

0x800a138f - JavaScript runtime error: Unable to get property '$' of undefined or null reference
0
I am using a NoUISlider in asp.net and want to know how to retrieve the values for the slider. It is a multi-slider, so needs to return the left and right sides.
slider
From what I've determined by reading, I will attach a javascript method to the save button.
btnSave.Attributes.Add("onClick", "SaveSlider();return true;")

Open in new window


Then the javascript will store the values to two hidden elements and I'll use those server side.

Code would look something like this:

    function SaveSlider() {

        var slider = document.getElementById('slider-tooltips');
        var values = slider.noUiSlider.get();

      //  var values = $('#exampleSlider0').noUiSlider('value');

        document.getElementById("hdnSlider1").value = values(0);
        document.getElementById("hdnSlider2").value = values(1);
    }

Open in new window


I read that it retrieves the values as an array.

How do I retrieve and store the values to the hidden fields?

Also, any suggestions for populating the values on page load with existing values?

Anyone have an existing method?

thanks!
0
The following codes came from mvc action result.
Assume the message return string called "file 1"
Using javascript, how to get value (which is file 1).

Thanks

 if (isSavedSuccessfully)
            {
                return Json(new { Message = fName });
            }

Open in new window

0
Hi,

How can I say if the dropdown list has been selected then append the value or the text to the textarea box.

I'm using bootstrap dropdown list.

  $("#AppendConditionBtn").click(function () {

            var RangeBoxFrom = $("#RangeBoxFrom").val().length;
            var RangeBoxTo = $("#RangeBoxTo").val().length;
            var GetOperatorSelectValue = $("#OperatorSelect option:selected").val();
            var GetConditionSelectValue = $("#ConditionSelect option:selected").text();
            var GetValueSelectValue = $("#ValueSelect option:selected").val();
            var GetGroupSelectValue = $("#GroupSelect option:selected").text();
            var GetItemsTextAreaValue = $("#ItemsTextArea").val();
            var GetOperatorSelectForRangeValue = $("#OperatorSelectForRange option:selected").val();
            var GetConditionSelectForRangeValue = $("#ConditionSelectForRange option:selected").val();
            var GetValueSelectForRangeValue = $("#ValueSelectForRange option:selected").val();
            var GetRangeBoxFromValue = $("#RangeBoxFrom").val();
            var GetRangeBoxToValue = $("#RangeBoxTo").val();

             if (RangeBoxFrom > 6 || RangeBoxTo > 6) {
                 alert("Range should be less than 6 character");
                 return false;
             }

// Here how can I say if the multiselectbox list has been selected then append the value or text to the "ContidionsAndAttributesTextArea"
otherwise don't append. 

        

Open in new window

0
I am in the process of creating a rock solid secure image upload system for a website I am working on.

Naturally, I want to do client side checks to validate the image file (jpg or png), before I upload it for further checks to the server (using php) - and I assume for that I will use Javascript.

I know there is quite a lot to take into consideration here, so I'm taking it one step at a time.

My question is this, SHOULD I be using jquery for the client side image verification or vanilla javascript.

I know jquery is just javascript ultimately, but I have a propensity to do this with vanilla javascript. Personally I think vanilla javascript 'reads' better as code than jquery. I would also assume it's actually faster at execution.

Online, there is almost no useful information about vanilla javascript with regards to secure image file validation (there are snippets here and there I know) - but there is lots of information about jquery. I am the sort of person who likes to do things 'raw'. So that I can understand fully what my code is doing without any wrapper.

Am I missing something? Is jquery really great at something I'm not understanding? I see jquery code, and the equivalent javascript code, and don't really understand why people are so 'into' jquery. The code lengths are generally similar, and am personally not afraid of coding a bit more if that's what it takes.

I think part of it might be that jquery is all over the internet, and vanilla …
0
Why would you add methods to an object via the Object's prototype?
0
Announcing the Winners!
LVL 19
Announcing the Winners!

The results are in for the 15th Annual Expert Awards! Congratulations to the winners, and thank you to everyone who participated in the nominations. We are so grateful for the valuable contributions experts make on a daily basis. Click to read more about this year’s recipients!

Hi,

my Group select is not triggering my on change event.

1. I have a select dropdown list that select px or dx .....
2. Upon selecting from the first dropdown list the Group select will get populated with a list of dx or px.....
3. ounce the user select from the list of dx or px I need to populate the textarea with the list Item.
but for some reason my Group Select is not triggering my on change event to send the data to the textarea called ItemsTextArea

<script>
    $(document).ready(function () {

       // debugger;

        $('#OperatorSelect').multiselect(getOperatorOptions(true));
        $('#ConditionSelect').multiselect(getOperatorOptions(true));
        $('#ValueSelect').multiselect(getOperatorOptions(true));
        $('#GroupSelect').multiselect(getGroupOptions(true));


        $("#ConditionSelect").change(function (event) {
            var GetValue = $(this).val();
            $('#HiddenFieldForSelectedCondition').val(GetValue);
            var method = $('#RulePartialViewForm').attr("method").toLowerCase();
            var action = $('#RulePartialViewForm').attr("action");
            var data = $('#RulePartialViewForm').serialize();
            $.ajax({ method: method, url: action, data: data }).done(
                function (json) {
                    var arr = [ '<option>Select</option>' ];
                    $.each(json, function (i, obj) {
                        arr.push('<option value="' + json[i].Value + '">' + json[i].Text

Open in new window

0
I need to prevent "orphan dates" being submitted in form. The attached form is prevents bad dates from being submitted, but it does not block entries that contain ONLY a date. All lines should have a valid date followed by some text.

Example: A line that only has a date, like this:

·12/12/2019

Should not pass validation.

These lines are good:

·10/23/2019 - test
·10/24/2019 - testing again

Here is test content (note, the bullet character must be included):

·10/23/2019 - test
·10/24/2019 - testing again
·10/01/2019 - here's another test
·12/03/2019 - sort this one too
·12/1/2019 - bad date should be caught
·12/12/2019
·12/x/2019

By the time all validation is done, all acceptable entries (i.e., valid date followed by text) should be accepted and properly sorted.

Who can help with this validation issue?

Thanks!
sort_test.htm
0
I have a page with a sticky header, when you scroll down, but it gets in the way.
http://arkiteks.us/ARK/Shop/ShopDonate/ShopDonate.aspx

Can anyone help me fix this, so it stays at the top of the page content and doesn't be on top of content so I can read the content?

example
Thanks!
0
In .Net the regex (?<=>[^<]*?)\bă works as expected (find words that start with ă and are not located within a tag).

But in JavaScript Chrome \b won't work with Unicode texts.

What would be the correct equivalent in JavaScript for the above .Net expression?

(I am referring to the latest versions of regex/regexp)
0
I'm going through a tutorial and I want to better understand what "fetch()" is.

The instructor references it as "fetch API" and I am working in a Vue.js context. When I go to google it, I get some Javascript and some npm hits, but I wanted to confirm with some minds greater than my own exactly what this is.

Here's my code:

<template>
	<div>
		<h2>Articles</h2>
		<nav aria-label="Page navigation example">
			<ul class="pagination">
				<li v-bind:class="[{disabled: !pagination.prev_page_url}]" class="page-item">
				<a class="page-link" href="#"
				@click="fetchArticles(pagination.prev_page_url)">Previous</a></li>
				<li class="page-item disabled"><a class="page-link text-dark" href="#">
				Page {{ pagination.current_page }} of {{ pagination.last_page }}</a></li>
				<li v-bind:class="[{disabled: !pagination.next_page_url}]" class="page-item">
				<a class="page-link" href="#"
				@click="fetchArticles(pagination.next_page_url)">Next</a></li>
			</ul>
		</nav>
		<div class="card card-body mb-2" v-for="article in articles" v-bind:key="article.id">
			<h3>{{ article.title }}</h3>
			<p>{{ article.body }}</p>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				articles: [], 
				article: {
					id: '',
					title: '',
					body: ''
				},
				article_id: '',
				pagination: {},
				edit: false
			}
		},
		
		created() {
			this.fetchArticles();
		},
		
		methods: {
			fetchArticles(page_url) {
			let vm = this;
			page_url = 

Open in new window

0
Here's my  "Articles.vue" file:

❶ <template>
	<div>
		<h2>Articles</h2>
	</div>
</template>

<script>
	❷ export default {
		❸ data() {
			return {
				articles: [], 
				article: {
					id: '',
					title: '',
					body: ''
				},
				article_id: '',
				pagination: {},
				edit: false
			}
		},
		
		❹ created() {
			this.fetchArticles();
		},
		
		methods: {
			fetchArticles() {
				fetch('api/articles')
					.then(res => res.json())
					.then(res=> {
						console.log(res.data);
					})
			}
		}
	}
</script>

Open in new window


My question revolves around bullet #3. What is "data?" I wanted to better understand the nomenclature of what I'm coding and when I googled it, I gravitated to this: https://api.jquery.com/data/. Basically, "data()" is a method. But the syntax was a little different and I wanted to make sure I was barking up the right tree.

What is data()?
0
Hi, when I click on link "Comments" a modal popup opens up and shows content, therefore it does what it is supposed to.
 
Going to my issue:
In the first scenario, it happens what I want but some other code does not get implemented. In this case, I place the "@section" inside Index.cshtml and the modal popup is rendered in the middle of the page with some styling(which is what I want),  but the datatable and yadcf code above the @section does not seem to get executed(datatable filters not there).  I show this scenario in jpeg attached called "Modal Popup Centered".

On the other hand, in the second scenario, if I put the @section inside the "ViewAll" view the datatable works correctly, the modal popup come up as well, but it does not get the rest of the functionalities(like being centered and the style).  I show this second scenario in the jpeg called "Modal Popup Not Centered".

I would like to leave the code in the ViewAll view(second scenario) as this is the one related to the modal popup.  Also, when I do that the attached error comes up.  I looked the error up and it seems there may be some incompatibility?  If so, why would it work on the index page then?

Could you please help?  I spent lots of time trying to resolve the issue but was unsuccessful.

THIS IS THE LAYOUT VIEW CODE:
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title 

Open in new window

0
In Logic Apps I have this function which replaces double double quotes with a zero for some strings. How can I replicate this in Javascript?
replace(replace(replace(replace(replace(body('HTTP_2'),'"PR_RENT":""','"PR_RENT":0'),'"PR_ID":""','"PR_ID":0'),'"PR_USUM":""','"PR_USUM":0'),'"PR_LEAS":""','"PR_LEAS":0'),'"PR_USER8":""','"PR_USER8":0')

Open in new window


I tried this code, but it is not working.  The first line is because I'm using the javascript in Logic Apps.

var json = workflowContext.actions.HTTP_2.outputs.body
if (json.PR_RENT=="\"\"")
{
json.PR_RENT=0
}
if (json.PR_ID=="\"\"")
{
json.PR_ID=0
}
if (json.PR_USUM=="\"\"")
{
json.PR_USUM=0
}
if (json.PR_LEAS=="\"\"")
{
json.PR_LEAS=0
}
if (json.PR_USER8=="\"\"")
{
json.PR_USER8=0
}
return json;

Open in new window


Here is some of my json code.
{"Payload":[{"RLS_GROUP":"","PR_SNAM":"700063","PR_OWN":"qqq","PR_REF":"","PR_NAME":"Bqqq12","PR_ADD1":"qqq","PR_ADD2":"INDUSTRIAL ESTATE","PR_ADD3":"23  INDUSTRIAL 

Open in new window

0
I need some advice on whether or not a particular website development strategy that I'm considering implementing is feasible, ... or if it would be an SEO nightmare.  

What I'd like to do is to try to use ES6's "backticks" functionality to implement a very simple "includes" mechanism for re-usable elements within a static HTML page.  The idea would be to avoid having to use any kind of JS-based framework or library (ie: React, jQuery, etc), and to instead just leverage the native functionality within ES6.  

Consider the following very simple and very functional example:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>ES6 Backticks Test</title>    
  <style>
  .red { color:red; }
  </style>   
</head>
<body>	
<div id="example"></div>	
<script>
document.addEventListener("DOMContentLoaded",function(){
	let first = "Yvan", last = "Gagnon", nuts = 2
	example.innerHTML = `
	<h1 class="red">Hello ${first} ${last}!</h1>
	You collected ${nuts} nuts so far!
	<hr>
	Double it and get ${nuts + nuts} nuts!!
	` 	
});
</script> 			
</body>
</html>

Open in new window


This approach would allow me to create separate JS-based include files for different re-usable elements throughout a static HTML website (ie: header, footer, sidebar, etc), and I'm tempted to run with it.  However, .. would this be an SEO nightmare?  I ask because when I view the underlying source code, I don't see the rendered HTML source code.  All I see is exactly what you see in the code sample I've provided.  Still .. my understanding is that the major search engines are all now executing JavaScript when crawling sites, which allows for them to be properly indexed.  So what is the modern-day consensus on this?  Am I wasting my time? Or is this approach that I'm considering actually viable?

Thanks,
-- Yvan
0
Python 3 Fundamentals
LVL 19
Python 3 Fundamentals

This course will teach participants about installing and configuring Python, syntax, importing, statements, types, strings, booleans, files, lists, tuples, comprehensions, functions, and classes.

When form is re-submitted via JavaScript on another page, one (and maybe more, I haven't looked) of the $_POST values is missing.  Many others do exist.

A text box with the same name/id as the requested $_POST element exists on the submitted form (I've verified the name/id.) and that text box contains text, but PHP is throwing an "Undefined index:" error when I do a "$v = $_POST['xx']".  I did a dump of the $_POST elements and it is not there.

If, however, I re-submit from the form itself (not from another open page), that $_POST value DOES exist.

As a note, there are over 100 fields on the re-submitted page.  Don' t know if this would affect it, or not.

Has anyone heard of this behavior and, if so, how to correct?

Thanks,
Bruce

JavaScript that submits page. It is on the active window, function is called by a button click:

function CloseIt()
{
	if (!(window.opener.document.adiApproveOrder == undefined) 
	 && !(window.opener.document.adiApproveOrder.closed)) {
		var actn = document.getElementById("action").value;
		if (actn == "approved") {
			window.opener.document.adiApproveOrder['action'].value = "deliver";
		} else if (actn == "submitted") {
			window.opener.document.adiApproveOrder['action'].value = "submitted";
		} else {
			window.opener.document.adiApproveOrder['action'].value = "";
		}
		window.opener.document.adiApproveOrder.submit();
	}
	window.close();
}

Open in new window

0
Hi Experts,
The JavaScript below adds 3, 5, 7, and 12 minutes to the originally entered time.
How can I modify the code so that the calculated time is displayed in HH:MM format?  (e.g. 08:03 instead of 8:3)
Thank you for your help.
<html>
<head>
<title>Add Time</title>
<script language="javascript" type="text/javascript">
function CalcTime() {
  var myinput = document.getElementById('StartTime');
  var mydate = new Date();
  var mytime = myinput.value;

  var Time1 = document.getElementById('Time1');
  var time2 = document.getElementById('time2');
  var time3 = document.getElementById('time3');
  var time4 = document.getElementById('time4');

  if (mytime !== "") {
    // no format being tested
    var timearray = mytime.split(':');

    mydate = new Date(mydate.getFullYear(), mydate.getMonth(), mydate.getDate(), timearray[0], timearray[1], 0, 0);

    var mydatems = Date.parse(mydate);

    var newval = 0;

    newval = new Date(mydatems*1 + (3*60*1000));
    Time1.value = newval.getHours() + ":" + newval.getMinutes();

    newval = new Date(mydatems*1 + (5*60*1000));
    time2.value = newval.getHours() + ":" + newval.getMinutes();

    newval = new Date(mydatems*1 + (7*60*1000));
    time3.value = newval.getHours() + ":" + newval.getMinutes();

    newval = new Date(mydatems*1 + (12*60*1000));
    time4.value = newval.getHours() + ":" + newval.getMinutes();

  }
}
</script>
</head>

<body>

<form name="AddTime">
Start time<input type="text" value="00:00" 

Open in new window

0
I have a node.js express web application I’d like to covert to a native app for iOS and Android so that I can use the smartphone Bluetooth interface to connect to peripheral devices (Raspberry Pi and/or Arduino). I’d like to develop one app for both iOS and Android and am proficient with JavaScript so am leaning towards React Native, although I have no experience with React. I’m also considering Swift and Flutter. I’d like to develop in my IDE of choice, VS Code, if possible.
This project is foremost for learning so a long learning curve is not an issue. Main considerations are leveraging my web application dev experience and learning new tech that will last.
Any input is welcome!
0
Hi Experts,

I have a calculated field in a Caspio datapage that would like to change the appearance as follows.

1- Bigger size and bold.
2- Should be flashing.

The calculated value is.

case when [@field:Browser]="Chrome 78.0"  or [@field:Browser]="Safari 13.0" or [@field:Browser]="Firefox 69.0.1" or [@field:Browser]="Firefox 19.1" or [@field:Browser]="Firefox 68.1.1"   then ''  else 'Please update your browser!' end

Open in new window


See related question here.

Thanks
0
Hi Experts,

I have following code for detecting if user has latest version of Chrome and Firefox browsers.

   else if(bowser.chrome) {
        var translate_bowser_osname = {"Windows":"win", "macOS":"mac"};
        $.getJSON("https://omahaproxy.appspot.com/all.json?os=" + translate_bowser_osname[bowser.osname] + "&channel=stable", function(data) {
            var latest = data[0].versions[0].current_version.match(/\d*\.{0,1}\d+/).pop() * 1;
            // FOR TESTING PURPOSE WE SET CURRENT BROWSER VERSION TO 77 (CURRENT IS 78.x.y)
            //if(version<latest) { // UNCOMMENt THIS LINE TO COMARE THE RIGHT CHROME USER VERSION AND COMMENT NEXT ONE
            if(77<latest) {
                var confirMsg = "please update your browser to the latest version";
                saveBrowserInfos("https://www.youtube.com/watch?v=RyI7RyEEPxM", confirMsg);
            }
            else {
                loginForm.submit();
            }
        });
    }

Open in new window


    else if(bowser.firefox) {
        $.getJSON("https://product-details.mozilla.org/1.0/firefox_versions.json", function(data) {
            var latest = data["LATEST_FIREFOX_VERSION"].match(/\d*\.{0,1}\d+/).pop() * 1;
            if(version<latest) {
                var confirmMsg = "please update your browser to the latest version";
                saveBrowserInfos("https://www.youtube.com/watch?v=K9LZmxT9K30", confirmMsg);
            }
            else {
                loginForm.submit();
            }
        });
    }

Open in new window


Would like to add checking for Safari as well.

Thanks
0
I'm working through this tutorial: https://www.youtube.com/watch?v=DJ6PD_jBtU0

At one point, it asks you to do an "npm install" and you're loading up these dependencies:

  "devDependencies": {
        "axios": "^0.19",
        "cross-env": "^5.1",
        "laravel-mix": "^4.0.7",
        "lodash": "^4.17.13",
        "resolve-url-loader": "^2.3.1",
        "sass": "^1.15.2",
        "sass-loader": "^7.1.0",
        "vue-template-compiler": "^2.6.10"
    }

Not more than a couple of minutes later in the tutorial, it asks you to go to the "resources -> assets -> js -> components" directory and create a .vue file.

The folder doesn't exist. There is no "components" directory and I'm wondering, since the tutorial didn't specify creating it if perhaps something was supposed to happen when I did the "npm install."

I can obviously create it, but I'm new to Laravel and I'm wondering if the "vue-template-compiler" wasn't supposed to create that and something went wrong.

Does "assets ->js-components" get created when you load in the .vue dynamic? Or can I just create that myself and Laravel will know to refer to that when I start creating the .vue files?
0

JavaScript

123K

Solutions

42K

Contributors

JavaScript is a dynamic, object-based language commonly used for client-side scripting in web browsers. Recently, server side JavaScript frameworks have also emerged. JavaScript runs on nearly every operating system and  in almost every mainstream web browser.