I am trying to export my JQgrid data into excel by insert a button.
But it is showing
No such method: exportToExcel
I am working in asp.net mvc.
$("#export").on("click", function(){
$("#grid").jqGrid("exportToExcel",{
includeLabels : true,
includeGroupHeader : true,
includeFooter: true,
fileName : "jqGridExport.xlsx",
maxlength : 40
})
})
});
Related
Can we make OpenSeaDragon IIIF Viewer work with manifests json? Is Mirador the only option or can we use something else and make OpenSeaDragon work?
I have a manifest.json https://api.bl.uk/metadata/iiif/ark:/81055/vdc_00000004216E/manifest.json and I am trying to use OpenSeaDragon to view it, but it gives me error "No TileSource was able to open".
const source = new TileSource({
url: imageUrl1
})
source && source.addHandler('ready', (event) => {
const viewer = new Viewer({
element: imageElementRef.current,
prefixUrl: '//openseadragon.github.io/openseadragon/images/',
tileSources: [event.tileSource],
showRotationControl: false
})
})
I want to use dropbox to upload files on my cordova app based on meteor i.e., user will be given option if he wants to upload file using dropbox if user click on the button then inappbrowser should open from where user will be authenticated and can upload file.
I am using below script
<script type="text/javascript" src="https://www.dropbox.com/static/api/2/dropins.js" id="id_dropbox" data-app-key="xxxxxxxxxxx"></script>
This is the code
e.preventDefault();
Dropbox.choose({
linkType: "direct",
multiselect: false,
extensions: ['.doc'],
success: function(files) {
console.log("files ", files[0]);
if(files[0]['bytes']<1000000){
GetBlobDataDropbox(files) //function to upload file
}else{
alert('Size should be less than 1 mb')
}
},
error:function(error){console.log(error)},
cancel: function() {}
});
This is giving me below error.
maximum call stack size exceded.
Please tell how to resolve it.
This is the template code around my code. I am not using helper on this template.
Template.AttachResume.events({
'click #dropbox' : function(e){
console.log('dropbox123 ',Dropbox)
e.preventDefault();
Dropbox.choose({
linkType: "direct",
multiselect: false,
extensions: ['.doc', '.docx', '.pdf', '.rtf', '.txt', '.odt'],
success: function(files) {
console.log("files ", files[0]);
if(files[0]['bytes']<1000000){
GetBlobDataDropbox(files)
}else{
alert('Size should be less than 1 mb')
}
},
error:function(error){console.log(error)},
cancel: function() {}
});
},
})
Does ASP.NET MVC Spreadsheet control in 3rd party tool syncfusion support cross sheet reference? I've been trying to look if cross sheet reference is being supported but could not find any.
Yes. Syncfusion have provided the support for the cross sheet reference in ASP.NET MVC Spreadsheet. Please refer the following Spreadsheet sample to demonstrate the cross sheet reference in formulas.
JS Playground
Code Snippet :
<div id="Spreadsheet"></div>
<script type="text/javascript">
var productData = [
{ Product: "Product1", Quantity: 10, Price: 10 },
{ Product: "Product2", Quantity: 12, Price: 20 }];
$(function () {
$("#Spreadsheet").ejSpreadsheet({
//...
sheetCount: 2,
sheets: [
{ rangeSettings: [{ dataSource: productData, startCell: "A1", showHeader: true }] },
],
loadComplete: "loadComplete"
});
});
function loadComplete(args) {
if(!this.isImport){
this.gotoPage(2, false); //Make Sheet2 as active sheet.
this.XLEdit.updateValue("A1", "=Sheet1!A1"); // Here "=Sheet1!A1" is Sheet1=>"A1" cell value reference and the value of A1 cell in Sheet1 is updated in Sheet2 "A1" cell.
//...
this.XLEdit.updateValue("B2", "=PRODUCT(Sheet1!B2,Sheet1!C2)");
//...
}
}
</script>
Also, please refer the online MVC Spreadsheet hyperlink Sample. In that, we have used the cross sheet reference for the hyperlinks which is placed under the StockDetail column.
I have being trying to populate list of data in a grid for this purpose I have used JqGrid. I have installed jqGrid plugin from nuget manager and from online tutorial I have been trying to implement the same.
This is what I have done so far:-
View:-
<h2>Search</h2>
<div class="container">
<div class="row">
<table id="tblRecruiterGrid"></table>
<div id="dvPagination"></div>
</div>
</div>
<link href="~/Content/jquery-ui.css" rel="stylesheet" />
<link href="~/Content/ui.jqgrid.css" rel="stylesheet" />
<script src="~/Scripts/jquery-grid.locale-en.js"></script>
<script src="~/Scripts/jquery.jqGrid.js"></script>
<script src="~/Scripts/recruiter.js"></script>
Controller:-
public ActionResult RecruiterGridData(string sidx = "", string sord = "", int page = 1, int rows = 10)
{
var vData = recruiterRepo.GetAllByRelation();
int pageIndex = Convert.ToInt32(page) - 1;
int pageSize = rows;
int totalRecords = vData.Count();
int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);
switch (sidx)
{
case "RID":
vData = sord == "desc"
? vData.OrderByDescending(x => x.RecruiterID).ToList()
: vData.OrderBy(x => x.RecruiterID).ToList();
break;
default:
vData = sord == "desc"
? vData.OrderByDescending(x => x.RecruiterID).ToList()
: vData.OrderBy(x => x.RecruiterID).ToList();
break;
}
var vResult = vData.Skip(pageIndex * pageSize).Take(pageSize);
var jsonData = new
{
total = totalPages,
page = page,
records = totalRecords,
rows = vResult.Select(x => new
{
RID = x.RecruiterID,
RecruiterName = x.RecruiterName,
Email = x.Email,
CompanyName = x.CompanyName,
Designation = x.Designation,
Mobile = x.Mobile
}).ToList()
};
return Json(jsonData, JsonRequestBehavior.AllowGet);
}
Javascript:-
$(function () {
$('#tblRecruiterGrid').jqGrid({
url: "/Recruiter/RecruiterGridData/",
datatype: 'json',
mtype: 'get',
colNames: ['RID', 'Recruiter Name', 'Email', 'Company Name', 'Designation', 'Mobile'],
colModel: [{ key: true, hidden: true, name: 'RID' },
{ key: false, hidden: false, name: 'RecruiterName' },
{ key: false, hidden: false, name: 'Email' },
{ key: false, hidden: false, name: 'CompanyName' },
{ key: false, hidden: false, name: 'Designation' },
{ key: false, hidden: false, name: 'Mobile' }],
pager: '#dvPagination',
rowNum: 10,
rowList: [5, 10, 25, 50, 100],
sortname: 'RID',
sortorder: "asc",
height: 'auto',
gridview: true,
autoencode: true,
viewrecords: true,
caption: '',
emptyrecords: 'No records to display',
jsonReader: { repeatitems: false, id: 'RID' },
autowidth: true,
multiselect: false,
});
});
I'm being able to populate data in jqGrid but the paging is causing a problem. In browser developer console I'm getting a undefined error because of which the paging is not loading properly. I tried to search the problem in google but every result section pointed to include missing jqGrid file grid.locale-en.js which I have already included in my view some suggested to check if grid.locale-en.js is loaded before jquery.jqGrid.js so when I tracked down in network I got following result.
After doing lots of R&D I'm still not been able to resolve following error:-
Uncaught TypeError: Cannot read property 'integer' of undefined
Note:- Jquery libraries has already been defined in layout head section.
Please include always the exact version number of jqGrid, which you use, and the information about the fork of jqGrid (free jqGrid, Guriddo jqGrid JS or an old jqGrid in version <=4.7), which you use.
I suppose that you use some old version of jqGrid and you just used wrong name for locale (localization) file. The file name jquery-grid.locale-en.js is very suspected. The distribution of jqGrid have i18n with the file grid.locale-en.js. The usage of old jqGrid without locale file can produce the error Cannot read property 'integer' of undefined during filling the pager of jqGrid.
Another important error in your code is the usage of key: true property for more as one column. The column have to have unique values in every row. The property key: true informs jqGrid to use the contains from the column instead of the id property. You used already the option jsonReader: { repeatitems: false, id: 'RID' } which informs to use RID property of items as the rowid. This I would recommend you to remove unneeded hidden RID column from colModel and remove key: true, hidden: false from all other columns. You can remove options with default values: mtype: 'get', sortorder: "asc", caption: '' and multiselect: false.
I would recommend you to try to use free jqGrid, it's the fork of jqGrid, which I develop after Tony Tomov have changed the licence agreement of jqGrid and it's name to Guriddo jqGrid JS (see the post). Many new features, which
I implemented in free jqGrid are described in the wiki and readmes to all versions currently published.
I am working in extjs4. I have gridview as-
{
xtype : 'grid',
id : 'g2',
store : 'qb.qbquestionoptionStore',
columns : [ {
text : 'Options',
dataIndex : 'option',
flex : 1
}, {
text : 'Answer',
dataIndex : 'isAnswer',
flex : 2.5
},{
header : 'edit',
renderer : function(val) {
return 'Edit';
}
},
Above grid is showing option and isAnswer field. I am also having addoption button. When i am clicking on this button,its showing new option creation window as-
on click of its save button i want to add thses new option and isAnswer fields value in above grid.I have retrived thses newly inserted field values by code-
var win = button.up('window');
form = win.down('form');
record = form.getRecord(), values = form.getValues();
console.log(values.option);
console.log(values.isAnswer);
So how to insert these values in above grid?
There is separation between data and view in ExtJs. All data related stuff is handled via stores and models. So if you want to insert new row into the grid you should insert it into the corresponding store:
var store = Ext.getStore('qb.qbquestionoptionStore');
store.add(form.getValues());