nodejs ractive and consolidate html comment issue - html

I am using consolidate.js and ractive templates, which by default strip out comments. I am trying to add some html logic in the page that does something like this:
<![if IE]>one thing<![endif]>
<![if !IE]>another thing<![endif]>
However ractive removes the comments. I know you can allow comments in ractive, by setting stripComments false, but I don't know how to do that through consolidate.js.

The second argument of consolidate.ractive() is passed directly to Ractive, so you can do this:
cons.ractive(path, { stripComments: false, user: 'Tobi' }, function () {});
In case you want to separate your data from Ractive config, you can do this instead:
cons.ractive(path, { stripComments: false, data: { user: 'Tobi' } }, function () {});
If the object doesn't have the data property, the whole object will be used as data as well.

Related

Webpack override behavior of require

I have a module I'm importing during my webpack that does something like so:
'use strict';
module.exports = {
position: true,
gfm: true,
commonmark: false,
footnotes: false,
pedantic: false,
blocks: require('./block-elements.json')
};
Webpack rewrites this module like so:
module.exports = {
position: true,
gfm: true,
commonmark: false,
footnotes: false,
pedantic: false,
blocks: __webpack_require__(/*! ./block-elements.json */ "./block-elements.json")
};
Another function is then assuming that the blocks member is a string.
Is there a way to override the writing of the webpack_require and replace it with my own function that loads the json in a string?
Finally fixed by writing my own loader and setting the default property on the module exports explicitly.
// Code for the loader
module.exports = function(source) {
// Just inline the source and fix up defaults so that they don't
// mess up the logic in the setOptions.js file
return `module.exports = ${source}\nmodule.exports.default = false`;
}
The other script was enumerating the keys of the returned object and the 'default' key was messing it up. However if a key had a type of Boolean it would let it through.
Specifically it was a problem with the remark-parser lib used for hosting markdown in a react control.

Unable to get save data event in ng2-smart-table

I am using ng2-smart-table for maintain data in my angular 6 app. As I seen in it's git and npm page. I have set my code like this way.
<ng2-smart-table
[settings]="settings"
[source]="characters"
(createConfirm)="onCreateConfirm($event)">
I am able to load data in table by call API. But when I am not able to get save data event. For that I have set function like this.
onCreateConfirm(event) {
alert("Clicked...");
}
I have set this function under the ngOnInit.
It's a common issue, you need to set in the configuration object the confirmCreate property, like this:
export const settings= {
delete: {
confirmDelete: true,
...
},
add: {
confirmCreate: true,
...
},
edit: {
confirmSave: true,
...
},
....

Should I convert JSON to Array to be able to iterate it with v-for?

In the following code I am getting data from server and filling array with them:
Vue.http.post('/dbdata', DataBody).then((response) => {
App.$refs.userContent.rasters_previews_list.$set(response); // putting JSON answer to Component data in userContent
console.log("App.$refs.userContent.rasters_previews_list: ", App.$refs.userContent.rasters_previews_list.length);
}, (response) => {
console.log("Error")
});
Now I am filling. data is declared in var userContent = Vue.extend({. I am using App.$refs.userContent.rasters_previews_list to set it's value, because one man from SO said that there is no other way to get access to constructor. I tried to do output of rasters_previews_list after changing with watch, but here is what I am see. http://img.ctrlv.in/img/16/08/04/57a326e39c1a4.png I really do not understand am I setting it's right way or no. If yes, why I do not see data and see only this crap?
data: function () {
return {
rasters_previews_list: []
}
}
But How I can iterate it with v-for?
<ul v-for="img in rasters_previews_list">
<li>{{img}}</li>
<ul>
This code is display one bullet. So it's look like it's assume that there is one object.
My object in browser console look like:
Object {request: Object, data: Array[10], status: 200, statusText: "OK", ok: true}
Your setting the full response instead of just the data you actually need.
Vue.http.post('/dbdata', DataBody).then((response) => {
App.$refs.userContent.rasters_previews_list.$set(response.data);
console.log("App.$refs.userContent.rasters_previews_list: ", App.$refs.userContent.rasters_previews_list.length);
}, (response) => {
console.log("Error")
});
If this isn't what you are looking for please post a full example.

Sencha/Extjs rest call with all parameters

I'm using ExtJs 5.1.1 and I've written a simple view with a grid, and selecting one row the corresponding model property are editable in some text fields.
When editing is completed the button 'save' call Model.save() method, which use the rest proxy configured to write the changes on the server.
The call made by the proxy are two, first is OPTIONS call to know which method are allowed, second call is a PUT.
My problem is PUT json contains only the changed attributes.
I would like that my application sends all the attributes in PUT, instead only the changed subset.
Is this a proxy configuration, or should I use another kind of proxy, like ajax?
Some code snippet:
Model:
Ext.define('myApp.model.CvModel', {
extend: 'Ext.data.Model',
alias: 'viewmodel.cv',
idProperty : 'code',
proxy: {
type: 'rest',
url: 'http://localhost:8080/CV/resource/rest/cvs/CodeSystem/Domain',
paramsAsJson: true,
reader: {
type: 'json',
rootProperty: 'Test_data'
}
},
fields: [{
...
Controller:
onSave: function () {
var selCv = this.getViewModel().get('selectedCv');
selCv.save();
....
You need to specify a writer config on your proxy with writeAllFields: true. By default it's false, and the default writer itself is just {type: 'json'}.

jqGrid toolbar search with autocomplete using json data

I found the very nice demo by Oleg (http://www.ok-soft-gmbh.com/jqGrid/FillToolbarSearchFilter.htm) which shows a "jqGrid toolbar search with autocomplete using local data" but have trouble to get this to work for json via ajax. Is there a good reason why the autocomplete feature won't work - even if I force the grid to be local after loading?
$(document).ready(function() {
var mygrid = $("#mylist"),
mygetUniqueNames = function(columnName) {
var texts = mygrid.jqGrid('getCol',columnName), uniqueTexts = [],
textsLength = texts.length, text, textsMap = {}, i;
for (i=0;i<textsLength;i++) {
text = texts[i];
if (text !== undefined && textsMap[text] === undefined) {
// to test whether the texts is unique we place it in the map.
textsMap[text] = true;
uniqueTexts.push(text);
}
}
return uniqueTexts;
};
mygrid.jqGrid({
url:'autocompleteTest.php',
datatype: "json",
colNames:['name', 'City','stateCd'],
colModel:[
{name:'name',index:'name',width:225, search: true},
{name:'City',index:'City',width:125},
{name:'stateCd',index:'stateCd',width:75},
],
rowNum: 100,
loadonce : true,
sortname: 'name',
sortorder: 'desc',
sortable: true,
viewrecords: true,
rownumbers: true,
sortorder: "desc",
ignoreCase: true,
pager: '#mypager',
height: "auto",
caption: "How to use filterToolbar better with data from server"
}).jqGrid('navGrid','#mypager',
{edit:false, add:false, del:false, search:false, refresh:false});
mygrid.jqGrid('setColProp', 'name',
{
searchoptions: {
sopt:['bw'],
dataInit: function(elem) {
$(elem).autocomplete({
source:mygetUniqueNames('name'),
delay:0,
minLength:0
});
}
}
});
mygrid.jqGrid('filterToolbar',
{stringResult:true, searchOnEnter:true, defaultSearch:"bw"});
});
It is difficult to provide an example in case of the usage of remote source parameter of jQuery UI Autocomplete. The main problem is that your question is about jqGrid which is pure JavaScript solution. If we would discuss the server part of tha solution we would have too options. Many users uses different languages: Java, C#, VB, PHP and so on. For example I personally prefer C#. Then we would have to choose the technology which we use: ASP.NET MVC, WCF, ASPX web service and so on. For example I would choose WCF. Then we should define the database access technology, for example, Entity Framework, LINQ to SQL, SqlDataReader, SqlDataAdapter and so on. Let us I would choose Entity Framework and would provide you the corresponding code example, but it would help you not really if you use for example PHP and MySQL.
So I just describe which interface should have the server for the remote source parameter of jQuery UI Autocomplete without any code.
You should replace in my example the source parameter to your server url like following:
dataInit: function(elem) {
$(elem).autocomplete({
source:'yourSearchUrl.php',
minLength:2
});
}
If the user types two characters (the value can be changed by minLength option), for example 'ab' then the autocomplete will make HTTP GET request with the parameter term=ab:
yourSearchUrl.php?term=ab
your server should answer with the JSON data in the same format as for the local source. I used the string array format in my previous example. Another supported format is array of objects with label/value/both properties like
[
{
"id": "Dromas ardeola",
"label": "Crab-Plover",
"value": "Crab-Plover"
},
{
"id": "Larus sabini",
"label": "Sabine`s Gull",
"value": "Sabine`s Gull"
},
{
"id": "Vanellus gregarius",
"label": "Sociable Lapwing",
"value": "Sociable Lapwing"
},
{
"id": "Oenanthe isabellina",
"label": "Isabelline Wheatear",
"value": "Isabelline Wheatear"
}
]
read the documentation for more information.
If you need to implement more complex scenario and send some additional data to the server or convert the server response in any way you can use custom source callback function. In the case you should use source: function(request, response) {/*your implementation*/}, where the request would be an object having term property (request.term). Inside of your implementation your should make ajax request to the server manually. The response would be callback function which you should call after your custom ajax request will be finished (inside of success event handler). The response function should be called with the parameter which should be array in the same format as mygetUniqueNames returns. I recommend you to examine the source code from the jQuery Autocomplete demo.
To de able to provide unique data from one column of tabele you should just use SELECT DISTINCT SQL statement which are supported in the most databases.
I hope that my description would help you.
UPDATED: If you have the local source the solution you could find in my old answer which you already use. What you just need to do is to call the filterToolbar after the source array are filled. Because you load the data from the server your should move the call of filterToolbar inside of loadComplete. You use loadonce:true jqGrid option which switch the datatype from 'json' to 'local' after the first data loading. So you can include in the loadComplete event handler of your grid the code like the following:
var grid = $('#list');
grid({
url:'autocompleteTest.php',
datatype: 'json',
loadonce: true,
// ... other parameters
loadComplete: function(data) {
if (grid.getGridParam('datatype') === 'json') {
// build the set 'source' parameter of the autocomplete
grid.jqGrid('setColProp', 'name', {
searchoptions: {
sopt:['bw'],
dataInit: function(elem) {
$(elem).autocomplete({
source:mygetUniqueNames('name'),
delay:0,
minLength:0
});
}
}
});
mygrid.jqGrid('filterToolbar',
{stringResult:true,searchOnEnter:true,
defaultSearch:"bw"});
}
}
});
If you will need to reload the data from the server (change the datatype to 'json' and call grid.trigger('reloadGrid')) you will have to change the code above so that you first destroy the autocomplete widget with $('#gs_name').autocomplete('destroy') and then create it one more time with the same code like inside of dataInit.