I am getting this error on all contact point code and I can't seem to find how to design it. On Schema.org examples it looks like this is correct. I want to be sure I can get a structured snippet if possible.
Error: ContactPoint must be attached to a parent with a declared type.
Code:
Accident/Theft: 01-800-555-5555Roadside Assistance: 01-800-555-5556
Instances of ContactPoint may appear as a property value for properties types such as Organization, Message, ServiceChannel, Person, and more. See also http://schema.org/ContactPoint.
The code snippet below gives an example. It is tested on https://search.google.com/structured-data/testing-tool
<div>
<div itemtype="http://schema.org/Organization" itemscope>
<div itemprop="contactPoint" itemtype="http://schema.org/ContactPoint" itemscope>
<meta itemprop="contactType" content="customer service" />
<meta itemprop="telephone" content="+1-400-500-6000" />
</div>
<h1 itemprop="name">My Company</h1>
<link itemprop="url" href="http://www.mycompany.com/" />
</div>
</div>
Or, coded in json-ld:
{ "#context" : "http://schema.org",
"#type" : "Organization",
"url" : "http://mycompany.com",
"name" : "My Company",
"contactPoint" : [
{
"#type" : "ContactPoint",
"telephone" : "+1-400-500-6000",
"contactType" : "customer service"
}]
}
Related
in a loop, each item is an object. I have to use its value as another object's key.
for vue.js
<html>
<head>
<title>VueJs Introduction</title>
<script type = "text/javascript" src = "https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.3/vue.min.js">
</script>
</head>
<body>
<div id = "intro" style = "text-align:center;">
<h1>{{ message }}</h1>
<p>{{ jss }}</p>
<table>
<tr v-for="man in lst">
<th>{{ man.name }}</th>
<td>{{jss.man.name}}]</td> <!-- not corrrect -->
<td>{{jss[man.name]}}]</td> <!-- not corrrect too-->
</tr>
</table>
</div>
<script type = "text/javascript">
var vue_det = new Vue({
el: '#intro',
data: {
message: 'My first VueJS Task',
jss: {"n1": 999},
lst: [
{"name": "n1"},
{"name": "n2"}
]
}
});
</script>
</body>
</html>
above cannot work. it plains 'jss.man.name' or 'jss[man.name]' is not a good expression. what I want is 999
You need to understand fundamentally what your code is doing.
When you have an expression of the form first.second, you're roughly requesting that your code retrieve the value named second from the object named first. Note that jss.man.name would then mean "retrieve the value called man from the object jss, and then retrieve the value called name from man". Your object called jss does not contain anything called man, however, so this will return undefined, and undefined definitely does not contain a value named name. In fact, when you try to retrieve the value of a property from undefined, you'll get an error, and when you get an error Vue will make it look like nothing is working at all.
What you're really trying to do is find the value named name in the object named man, and then use this name to retrieve a value from jss. This looks like jss[man.name], which is one of the solutions you have in place. Simply omit the jss.man.name and your code should work:
<html>
<head>
<title>VueJs Introduction</title>
<script type = "text/javascript" src = "https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.3/vue.min.js">
</script>
</head>
<body>
<div id = "intro" style = "text-align:center;">
<h1>{{ message }}</h1>
<p>{{ jss }}</p>
<table>
<tr v-for="man in lst">
<th>{{ man.name }}</th>
<!--<td>{{jss.man.name}}]</td> commenting this out should fix it! -->
<td>{{jss[man.name]}}</td> <!-- this should be correct-->
</tr>
</table>
</div>
<script type = "text/javascript">
var vue_det = new Vue({
el: '#intro',
data: {
message: 'My first VueJS Task',
jss: {"n1": 999},
lst: [
{"name": "n1"},
{"name": "n2"}
]
}
});
</script>
</body>
</html>
As noted elsewhere, you also had an extra ] being rendered as well. I've removed that in the code snippet above.
You did an extra ] in the end of one way data binding code. You can update the code like
<td>{{jss.man[name]}}</td>
or you can use,
<td>{{jss.man["name"]}}</td>
or,
<td>{{jss.man.name}}</td>
I'm building a new PWA in VueJS and have registered the app as a Share Target in my manifest.json (https://developers.google.com/web/updates/2018/12/web-share-target). Now my code works if I put the query params directly in the URL via the browser address bar (e.g. "/#/page-edit?url=https://google.com/&title=Google&description=SearchEngine"), but it doesn't work if I sent it via the Web Share Target API.
I have already tried a range of different manifest settings, but I'm not sure if my manifest settings are wrong or my code (e.g., tried both method "GET" and "POST", etc).
Current Manifest:
{
"name": "...",
"short_name": "...",
"icons": [],
"start_url": "/",
"display": "standalone",
"orientation": "portrait",
"background_color": "...",
"theme_color": "...",
"share_target": {
"action": "/#/page-edit",
"method": "GET",
"enctype": "application/x-www-form-urlencoded",
"params": {
"title": "title",
"text": "description",
"url": "url"
}
}
}
Current Vue view:
I have removed most of the not important code. As you can see I load the query data in two ways at the moment:
1. As data defaults, e.g., 'url': this.$route.query.url || null
2. As a variable in a <p>, e.g. {{ this.$route.query.url }}
<template>
<form class="modal-view">
<div class="field">
<label for="url" class="label">URL / link</label>
<div class="control">
<input id="url" v-model="url" class="input" type="url" placeholder="https://..." >
</div>
<p><strong>url query:</strong> {{ this.$route.query.url }}</p>
</div>
<div class="field">
<label for="title" class="label">Title</label>
<div class="control">
<input id="title" v-model="title" class="input" type="text" placeholder="The greatest article" >
</div>
<p><strong>title query:</strong> {{ this.$route.query.title }}</p>
</div>
<div class="field">
<label for="description" class="label">Description</label>
<div class="control">
<input id="description" v-model="description" class="input" type="text" placeholder="The greatest article" >
</div>
<p><strong>description query:</strong> {{ this.$route.query.description }}</p>
</div>
<hr class="is-small has-no-line">
<div class="field is-grouped is-grouped-right">
<div class="control">
<button #click.prevent="createPage" class="button is-primary is-fullwidth is-family-secondary">Submit</button>
</div>
</div>
</form>
</template>
<script>
import ...
export default {
name: 'page-edit',
computed: {},
data () {
return {
// Initialize default form values
'url': this.$route.query.url || null,
'title': this.$route.query.title || null,
'description': this.$route.query.description || null
}
},
mounted () {},
methods: {
createPage () {},
}
}
</script>
So what I would expect is that the query params can also be read if shared via the Web Share Target API, but at this point, it doesn't show anything this way. But good to mention again, it does all work if I simply change the query params in the browser address bar (that's also why I'm confused).
End result should look like
Edits
Edit 1
Have been playing around a bit more, and now found out that if I use window.location.href that it shows the following:
https://appurl.com/?title=xxx&description=xxx#/page-edit
I.e. it puts the query params in the wrong position?
Edit 2
Might be related to this Vue Router issue: Hash mode places # at incorrect location in URL if current query parameters exist on page load
Edit 3
Somehow fixed it with (I think)
const router = new Router({
mode: 'history'
And removing the # from the action in share_target
To fix it I have done the following things:
Added the following in the router, which resulted in removing the # from all URLs
const router = new Router({
mode: 'history'
Removed the # from the share_target.action in the manifest
Somehow fixed it all!
I have searched high and low for solution for this but I have not been able to find anything. I am playing around with the dojo ValidatationTextBox dijit. I have tried to both declarative and programmatic methods and every time it comes up as a readonly input field. The code provided shows my attempt using the declarative method. I got the exact same result using a programmatic route similar to the "new textbox" calls below. In both methods the html for the ValidatationTextBox is generated with two child divs. One with class=dijitReset dijitValidationContainer and one with class=dijitReset dijitInputField dijitInputContainer. It is the later class that holds all of the html input and dijit properties and the former that defines the form as readonly and also gives it a value of 'x'. What am I doing wrong? Any help or explanation regarding why this is not working will be much appreciated. Thanks
<script>
require(["dojo/parser", "dijit/form/TextBox", "dijit/form/ValidationTextBox","dojo/domReady!","dojox/validate","dojox/validate/web"],
function(parser, textbox, ValidationTextBox,validate){
parser.parse();
new textbox({
id: "fName",
maxlength: 25,
name: "fName",
trim: "true",
propercase: "true"
}, "fName");
new textbox({
id: "lName",
maxlength: 25,
name: "lName",
trim: "true",
propercase: "true"
}, "lName");
});
</script>
</head>
<body class="tundra">
<h3>Sign-up for our great offers:</h3>
<form id="registration_form">
<div class="grouping">
<label for="fName">First Name:</label>
<input id="fName" /><br />
<label for="lName">Last Name:</label>
<input id="lName" /><br />
<label for="email">Your Email:</label>
<input type="text" name="email" required="true" readonly="false"
data-dojo-type="dijit/form/ValidationTextBox"
data-dojo-props="regExp:'[a-z0-9._%+-]+#[a-z0-9-]+\.[a-z]{2,4}', invalidMessage:'Please enter a valid e-mail address'" /><br />
<button id="btn">Sign Up!</button>
</div>
</form>
</body>
I think the problem may be with your regExp however you can write a keyup function and call it when the user types it will validate the email address using Dojo's built in email validation. Also for your fname and lname fields try setting required = "true". You can do this to implement on the fly validation since if your fields are not required you need to call validation on your form when you post. You can refer to this Form Validation Fiddle
HTML
<input type= "text" name ="email" data-dojo-type="dijit/form/ValidationTextBox" missingMessage="Email Address Required" invalidMessage="Invalid Email Address" onkeyup="validateMe(this.value);" required="true" />
js
function validateMe(email){
var isValid = false;
isValid = dojox.validate.isEmailAddress(email);
return isValid;
}
I'm developing a website using Durandal/Knockout/Breeze/WebApi with MVC4 as the back end.
I'm querying my api via breeze like so:
var getCategories = function() {
var query =
entityQuery
.from('Categories')
.orderBy('Order');
return manager.executeQuery(query);
};
Then, on my view model:
function initCategories() {
service.getCategories()
.then(querySuccess)
.fail(queryFail);
function querySuccess(data) {
vm.categories(data.results);
};
where vm is my bounded view model and categories is of observableArray of course.
Finally, my view has:
<!-- ko foreach: categories -->
<div class="list_images">
<a data-bind="attr: { href: '#search/' + queryString() }" class="hover-shadow">
<img data-bind="attr: { src: image(), alt: name() }" width="240" height="180">
<h5 data-bind="text: name()"></h5>
</a>
</div>
<!-- /ko -->
Here's the screenshot of what data.results contains:
It works fine, except for the need of using the parentheses.
With 'normal' viewmodels I don't need parentheses in the view bindings.
I can't figure out why it happens only with breeze objects (Entities).
Edit
After further investigation I noticed that my entities are of type proto._setCtor.proto instead of just an Object. Why's that?
Even if I use the breeze manager to create a new entity - this is the object I get back :(
What's wrong here?
This isn't an answer. This is a confession that I'm mystified. I can't duplicate the problem you describe.
I understand exactly what you are asking. I agree that you should not have to use the parentheses. You should be able to write:
<h5 data-bind="text: name"></h5>
and not have to write:
<h5 data-bind="text: name()"></h5>
I downloaded the "Todo-Knockout" sample from Breeze. After confirming that it worked, I started changing it to look more like your binding example. I continued to work.
You can follow along with me, step-by-step, confirming that everything works as expected after each step.
Switched to the comment form of repeater: <!-- ko foreach: items -->
Replaced the <ul> and <li> tags with div container.
Switched to the debug version of KO (that's what you're using)
Updated to the latest KO (knockout-3.1.0.debug.js)
In the end, my revised markup looks like this:
<!-- ko foreach: items -->
<div>
<div data-bind="visible: !isEditing()">
<input type="checkbox" data-bind="checked: IsDone" />
<label data-bind="text: Description, click: $parent.editBegin, css: { done: IsDone, archived: IsArchived }"></label>
X
</div>
<div data-bind="visible: isEditing">
<form data-bind="event: { submit: $parent.editEnd }">
<input type="text" data-bind="value: Description, hasfocus: isEditing" />
</form>
</div>
</div>
<!-- /ko -->
When I break in the Chrome Developer Tools where the results are returned from the server and display data.results in the console, I get this:
[proto._setCtor.proto
CreatedAt: function dependentObservable() {
Description: function dependentObservable() {
Id: function dependentObservable() {
IsArchived: function dependentObservable() {
IsDone: function dependentObservable() {
entityAspect: ctor
isEditing: function observable() {
__proto__: Object
, proto._setCtor.proto, proto._setCtor.proto]
I'm not seeing any significant differences from your example. Do you?
What happens when you do the same thing with the same "Todo-Knockout" sample on your machine?
What browser are you using? Do you see the same misbehavior in Chrome?
Breeze serializes all of the properties of your entity into ko.computeds under the covers. It uses this to intercept changes to the properties and notify all the other places your property is used. That being said you should only have to use parans in places where you are using conditional bindings (such as when you are combining a property with some string to make a longer string. Where ever you are just binding to a standard ko binding handler you should not need it.
I am trying to implement SWFUpload using the Play! framework and a Mac.
When using a Mac I get a 302 error (Upload Error: 302). This seems, I think, to come from the redirect that happens by getting the upload page of the Play! framework (as it is translated from the routes file?).
It works fine on IE on Windows.
I have searched a lot, and read a lot, but haven't found if there is a particular solution. Are there any suggestions on how to implement this, or any suggestions for another simple to implement file uploader (for big field, with progress)?
EDIT:
I have tried both Safari and Firefox on my Macbook and both return as status the 302 upload error. I tried again on Windows with IE and it works fine.
The html (stylesheet) code:
#{extends 'main.html' /}
#{set title: 'Upload Media File' /}
<script type="text/javascript" src="/public/swfupload/swfupload.js"></script>
<script type="text/javascript" src="/public/swfupload/swfupload.queue.js"></script>
<script type="text/javascript" src="/public/swfupload/fileprogress.js"></script>
<script type="text/javascript" src="/public/swfupload/handlers.js"></script>
<script type="text/javascript">
var swfu;
window.onload = function() {
var settings = {
flash_url : "/public/swfupload/swfupload.swf",
flash9_url : "/public/swfupload/swfupload_fp9.swf",
upload_url: "doUpload",
file_post_name: "data",
post_params: {"article.id" : "${article?.id}"},
file_size_limit : "1000 MB",
file_types : "*.*",
file_types_description : "All Files",
file_upload_limit : 1,
file_queue_limit : 0,
custom_settings : {
progressTarget : "fsUploadProgress",
cancelButtonId : "btnCancel"
},
debug: false,
// Button settings
button_image_url: "/public/swfupload/TestImageNoText_65x29.png",
button_width: "65",
button_height: "29",
button_placeholder_id: "spanButtonPlaceHolder",
button_text: '<span>Start</span>',
button_text_style: ".theFont { font-size: 16; }",
button_text_left_padding: 12,
button_text_top_padding: 3,
// The event handler functions are defined in handlers.js
swfupload_preload_handler : preLoad,
swfupload_load_failed_handler : loadFailed,
file_queued_handler : fileQueued,
file_queue_error_handler : fileQueueError,
file_dialog_complete_handler : fileDialogComplete,
upload_start_handler : uploadStart,
upload_progress_handler : uploadProgress,
upload_error_handler : uploadError,
upload_success_handler : uploadSuccess,
upload_complete_handler : uploadComplete,
queue_complete_handler : queueComplete // Queue plugin event
};
swfu = new SWFUpload(settings);
};
</script>
<h2 class="title">#{get 'title' /}</h2>
<div style="clear: both;"> </div>
#{form #index(), id:'uploadForm', enctype:'multipart/form-data'}
<div class="entity">
<p>This page demonstrates a simple usage of SWFUpload. It uses the Queue Plugin to simplify uploading or cancelling all queued files.</p>
<div class="fieldset flash" id="fsUploadProgress">
<span class="legend">Upload Queue</span>
</div>
<div id="divStatus">0 Files Uploaded</div>
<div>
<span id="spanButtonPlaceHolder"></span>
<input id="btnCancel" type="button" value="Cancel All Uploads" onclick="swfu.cancelQueue();" disabled="disabled" style="margin-left: 2px; font-size: 8pt; height: 29px;" />
</div>
</div>
#{/form}
The entry in the routes file (the Articles.upload is the screen, the doUpload is called by swfupload):
GET /admin/articles/{id}/upload Articles.upload
POST /admin/articles/doUpload Articles.doUpload
EDIT 2:
I also tried Uploadify, which returns the same error. Is there anybody who knows a workaround for the Play! framework or an uploader that does work with Play!
If you are in /admin/articles/{id}/upload and call doUpload without any /path/to/something, you're in the wrong "directory". Might it be that you test Windows locally, but MacOS remotely?
In any case, the problem most probably has nothing to do with the OS, but with something else.
There is html 5 uploader at http://www.uploadify.com which can be downloaded for $5, and it works perfect for me so far.