I have a line of code which comes inside a Telerik.Web.UI.Webresource.axd file which breaks something in my custom code.
dataBind:function(){if(this._virtualization&&!this._virtualization._isDataBinding&&((this.get_allowPaging()&&this._dataSource.length>this.get_pageSize())||(!this.get_allowPaging()&&this._dataSource.length>this._virtualization._itemsPerView))){this._virtualization._startIndex=null;
this._virtualization.set_bindingType("Client");
this._virtualization.set_cachedData(this._dataSource);
this._virtualization.set_virtualItemCount(this._dataSource.length);
this._virtualization.select();
return;
}
**Array.forEach($telerik.getElementsByClassName(this.get_element().tBodies[0],"rgGroupHeader"),function(i){i.parentNode.removeChild(i)**;
});
I would like to know if it is possible to prevent the below line of code to be executed
Array.forEach($telerik.getElementsByClassName(this.get_element().tBodies[0],"rgGroupHeader"),function(i){i.parentNode.removeChild(i)**;
You can override the dataBind method of RadGrid which will allow you to customize it:
<script>
Telerik.Web.UI.GridClientSideBinding.prototype.dataBind = function () {
// Virtualization
if (this._virtualization && !this._virtualization._isDataBinding &&
((this.get_allowPaging() && this._dataSource.length > this.get_pageSize()) ||
(!this.get_allowPaging() && this._dataSource.length > this._virtualization._itemsPerView))) {
this._virtualization._startIndex = null;
this._virtualization.set_bindingType("Client");
this._virtualization.set_cachedData(this._dataSource);
this._virtualization.set_virtualItemCount(this._dataSource.length);
this._virtualization.select();
return;
}
Array.forEach($telerik.getElementsByClassName(this.get_element().tBodies[0], "rgGroupHeader"), function (element) {
element.parentNode.removeChild(element);
});
Array.forEach($telerik.getElementsByClassName(this.get_element().tBodies[0], "rgFooter"), function (element) {
element.parentNode.removeChild(element);
});
var noRecordsItem = $telerik.getElementByClassName(this.get_element(), "rgNoRecords");
if (noRecordsItem) {
if (this._dataSource.length > 0) {
noRecordsItem.style.display = "none";
} else {
noRecordsItem.style.display = "";
this._setPagerVisibility(this._data.PagerAlwaysVisible);
}
}
var dataItems = this.get_dataItems();
var columns = this.get_columns();
var i, l1, l2;
var tableElement = ($telerik.isOpera) ? this.get_element() : this.get_element().tBodies[0];
if (this._dataSource.length < dataItems.length || tableElement.rows.length == 1) {
for (i = 0, l1 = dataItems.length; i < l1; i++) {
dataItems[i].set_visible(false);
dataItems[i].get_element().style.display = "none";
}
this._cacheDataItems();
}
this._dataBind(this._dataSource);
var firstSelection = true;
// When YahooStyleScrolling is used in RadGrid and user
//scrolls down, select multiple rows using shift + down arrow key,
//the selection is not persisted on next page load
if (this._owner._keyboardNavigationProperties) {
firstSelection = this._owner._keyboardNavigationProperties.firstSelection;
}
var owner = $find(this._owner.get_id());
if (owner._getPositionedDataItems) {
owner._getPositionedDataItems(true);
}
if (this._owner._keyboardNavigationProperties) {
this._owner._keyboardNavigationProperties.firstSelection = firstSelection;
}
this._fixRowsClassNames();
this._owner.raise_dataBound(Sys.EventArgs.Empty);
for (i = 0, l2 = columns.length; i < l2; i++) {
var isVisible = false;
if (columns[i].get_element().style.visibility != "hidden" && (columns[i].Display == null || columns[i].Display == true) &&
(columns[i]._data.Display == null || columns[i]._data.Display)) {
isVisible = true;
}
if (!isVisible) {
this.hideColumn(i);
}
}
if (this.get_id() == this._owner._masterClientID) {
var grid = $find(this._owner.get_id());
if (grid._scrolling) {
this._owner._scrolling.setHeaderAndFooterDivsWidth();
grid._scrolling._initializeVirtualScrollPaging(true);
}
}
}
</script>
Related
with a fresh install and up to date of wordpress (5.8.2), when I desactivate gutenberg editor, Wordpress add this javascript code in all TinyMCE editor (content, acf fields etc..)
I have no plugin and theme by default. I desactivate Gutenberg with code or with a plugin, no changes. Anyone have a tip ? thx
<script type="text/javascript">
var spector;
var captureOnLoad = false;
var captureOffScreen = false;
window.__SPECTOR_Canvases = [];
(function() {
var __SPECTOR_Origin_EXTENSION_GetContext = HTMLCanvasElement.prototype.getContext;
HTMLCanvasElement.prototype.__SPECTOR_Origin_EXTENSION_GetContext = __SPECTOR_Origin_EXTENSION_GetContext;
if (typeof OffscreenCanvas !== 'undefined') {
var __SPECTOR_Origin_EXTENSION_OffscreenGetContext = OffscreenCanvas.prototype.getContext;
OffscreenCanvas.prototype.__SPECTOR_Origin_EXTENSION_OffscreenGetContext = __SPECTOR_Origin_EXTENSION_OffscreenGetContext;
OffscreenCanvas.prototype.getContext = function () {
var context = null;
if (!arguments.length) {
return context;
}
if (arguments.length === 1) {
context = this.__SPECTOR_Origin_EXTENSION_OffscreenGetContext(arguments[0]);
if (context === null) {
return context;
}
}
else if (arguments.length === 2) {
context = this.__SPECTOR_Origin_EXTENSION_OffscreenGetContext(arguments[0], arguments[1]);
if (context === null) {
return context;
}
}
var contextNames = ["webgl", "experimental-webgl", "webgl2", "experimental-webgl2"];
if (contextNames.indexOf(arguments[0]) !== -1) {
// context.canvas.setAttribute("__spector_context_type", arguments[0]);
// Notify the page a canvas is available.
var myEvent = new CustomEvent("SpectorWebGLCanvasAvailableEvent");
document.dispatchEvent(myEvent);
this.id = "Offscreen";
window.__SPECTOR_Canvases.push(this);
if (captureOnLoad) {
// Ensures canvas is in the dom to capture the one we are currently tracking.
if (false) {
spector.captureContext(context, 500, false, false);
captureOnLoad = false;
}
}
}
return context;
}
}
HTMLCanvasElement.prototype.getContext = function () {
var context = null;
if (!arguments.length) {
return context;
}
if (arguments.length === 1) {
context = this.__SPECTOR_Origin_EXTENSION_GetContext(arguments[0]);
if (context === null) {
return context;
}
}
else if (arguments.length === 2) {
context = this.__SPECTOR_Origin_EXTENSION_GetContext(arguments[0], arguments[1]);
if (context === null) {
return context;
}
}
var contextNames = ["webgl", "experimental-webgl", "webgl2", "experimental-webgl2"];
if (contextNames.indexOf(arguments[0]) !== -1) {
context.canvas.setAttribute("__spector_context_type", arguments[0]);
// Notify the page a canvas is available.
var myEvent = new CustomEvent("SpectorWebGLCanvasAvailableEvent");
document.dispatchEvent(myEvent);
if (captureOffScreen) {
var found = false;
for (var i = 0; i < window.__SPECTOR_Canvases.length; i++) {
if (window.__SPECTOR_Canvases[i] === this) {
found = true;
break;
}
}
if (!found) {
window.__SPECTOR_Canvases.push(this);
}
}
if (captureOnLoad) {
// Ensures canvas is in the dom to capture the one we are currently tracking.
if (this.parentElement || false) {
spector.captureContext(context, 500, false, false);
captureOnLoad = false;
}
}
}
return context;
}
})()</script>
It is very likely added by the Spector.js extension : same behaviour with the Spector extension enabled on Firefox (when switching editor, or after save) => disabling the extension solved the issue.
How i can change Background Color when Validator active
in Asp.net i want to change background color to RED when validator is active befor postback on pagevalidating
function fnOnUpdateValidators()
{
if (typeof Page_Validators != 'undefined') {
for (var i = 0; i < Page_Validators.length; i++)
{
var val = Page_Validators[i];
var ctrl = document.getElementById(val.controltovalidate);
if (ctrl != null && ctrl.style != null)
{
if (!val.isvalid)
ctrl.style.background = '#FFAAAA';
else
ctrl.style.backgroundColor = '';
}
}
}
}
and in form load
Page.ClientScript.RegisterOnSubmitStatement(this.GetType(), "val", "fnOnUpdateValidators();");
It Simple.
Use If Condition.
var val = Page_Validators;
var ctrl = document.getElementById(val.controltovalidate);
if (ctrl != null && ctrl.style != null)
{
if (!val.isvalid)
ctrl.style.backgroundcolor = '#dddddd';
else
ctrl.style.backgroundColor = '';
}
I would rather add/remove class names from validator rather that setting the color directly.
$(document).ready(function () {
ValidatorUpdateIsValid = function () {
Page_IsValid = AllValidatorsValid(Page_Validators);
setValidatorStyles();
}
});
function setValidatorStyles() {
for (i = 0; i < Page_Validators.length; i++) {
var inputControl = document.getElementById(Page_Validators[i].controltovalidate);
if (null !== inputControl && !Page_Validators[i].isvalid) {
WebForm_AppendToClassName(inputControl, "invalidElement");
} else if (null !== inputControl) {
WebForm_RemoveClassName(inputControl, "invalidElement");
}
}
}
For telerik Radgrid, we are getting default values for filtering columns. But I need to have different filtering options for different columns.
I am able to remove some of the options like this
protected void RadGrid1_Init(object sender, System.EventArgs e)
{
GridFilterMenu menu = RadGrid1.FilterMenu;
int i = 0;
while (i < menu.Items.Count)
{
if (menu.Items[i].Text == "NoFilter" || menu.Items[i].Text == "Contains" || menu.Items[i].Text == "EqualTo" || menu.Items[i].Text == "GreaterThan" || menu.Items[i].Text == "LessThan")
{
i++;
}
else
{
menu.Items.RemoveAt(i);
}
}
}
But the problem here is filter options are getting removed for all the columns. I need different filter options for different columns.
Server side options is preferred.
Thanks in advance
http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/how-to/Filtering/reduce-the-filter-menu-options
Direct from Telerik: This is not possible using server-side code. You must use the client-side example from the link above (pasted below):
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script type="text/javascript">
var column = null;
function MenuShowing(sender, args) {
if (column == null) return;
var menu = sender; var items = menu.get_items();
if (column.get_dataType() == "System.String") {
var i = 0;
while (i < items.get_count()) {
if (!(items.getItem(i).get_value() in { 'NoFilter': '', 'Contains': '', 'NotIsEmpty': '', 'IsEmpty': '', 'NotEqualTo': '', 'EqualTo': '' })) {
var item = items.getItem(i);
if (item != null)
item.set_visible(false);
}
else {
var item = items.getItem(i);
if (item != null)
item.set_visible(true);
} i++;
}
}
if (column.get_dataType() == "System.Int64") {
var j = 0; while (j < items.get_count()) {
if (!(items.getItem(j).get_value() in { 'NoFilter': '', 'GreaterThan': '', 'LessThan': '', 'NotEqualTo': '', 'EqualTo': '' })) {
var item = items.getItem(j); if (item != null)
item.set_visible(false);
}
else { var item = items.getItem(j); if (item != null) item.set_visible(true); } j++;
}
}
column = null;
menu.repaint();
}
function filterMenuShowing(sender, eventArgs) {
column = eventArgs.get_column();
}
</script>
</telerik:RadCodeBlock>
<telerik:RadGrid...>
//Additional markup removed
<FilterMenu OnClientShowing="MenuShowing" />
</telerik:RadGrid>
Explanation from Telerik:
There is a single filtering menu object server-side. Not all of its
items appear in every filter menu client-side....The filtering menu is independent for each
column in RadGrid - this means that the filtering menu options vary by
the DataType of the corresponding column....However, if you remove some of the options
from the menu on the server, this will affect all grid columns and
they will be stripped from each column filter menu options (if
available by default for that type of column).
Chambo solution can be customise to solve this exact problem.
In Js:
First as you need to access the Column Name, you can add it to the filterMenuShowing function. Or access it via get_uniqueName() on column.
var column = null;
var columnName = null;
function MenuShowing(sender, args) {
if (column == null) return;
if (columnName == null) return;
var menu = sender; var items = menu.get_items();
if (columnName == "Date") { // If the column name is Date
var i = 0;
while (i < items.get_count()) {
if (!(items.getItem(i).get_value() in { 'NoFilter': '', 'Contains': '', 'GreaterThan': '', 'LessThan': '' })) {
var item = items.getItem(i);
if (item != null){
item.set_visible(false);
}
}
else { // Not mandatory.
var item = items.getItem(i);
if (item != null){
item.set_visible(true);
}
} i++;
}
}
else {
if (columnName == "Name") {
var j = 0;
while (j < items.get_count()) {
if (!(items.getItem(j).get_value() in { 'NoFilter': '', 'Contains': '', 'StartsWith': '', 'EndsWith': '' })) {
var item = items.getItem(j);
if (item != null){
item.set_visible(false);
}
}
else { // Not mandatory.
var item = items.getItem(j);
if (item != null){
item.set_visible(true);
}
} j++;
}
}
}
column = null;
columnName = null;
}
function filterMenuShowing(sender, eventArgs) {
column = eventArgs.get_column();
columnName = eventArgs.get_column().get_uniqueName();
}
In Aspx:
You need to link your function to the right client event as show in the documentation.
<ClientSettings>
<Scrolling AllowScroll="false" />
<ClientEvents OnFilterMenuShowing="filterMenuShowing" />
</ClientSettings>
and
<FilterMenu OnClientShowing="MenuShowing" />
I'm porting a v2 to v3 app map and there's one thing I can't get to work.
I have a custom control that is not shown, anything.
I'm not sure where is the problem so I'll post everything i think is relevant, ask for some more if needed
Here's the constructor:
Note that there's still the comments from v2
function Semaforo(){}
//Semaforo.prototype = new GControl();
Semaforo.prototype.semaforo = document.createElement("img");
Semaforo.prototype.initialize = function(map) {
var container = document.createElement("div");
var semaforoDiv = document.createElement("img");
semaforoDiv.setAttribute("class", "semaforo");
this.setButtonStyle_(semaforoDiv);
this.semaforo = semaforoDiv;
container.appendChild(semaforoDiv);
semaforoDiv.setAttribute("src", "img/semaforo_rojo.png");
map.getContainer().appendChild(container);
return container;
}
And some of the methods:
Semaforo.prototype.setColor = function(color, mapa) {
this.semaforo.setAttribute("src", "img/semaforo_" + color + ".png");
if(color == "rojo")
{
this.semaforo.setAttribute("alt", "Tr�fico dif�cil");
this.semaforo.setAttribute("title", "Tr�fico dif�cil");
}
else if(color == "ambar")
{
this.semaforo.setAttribute("alt", "Tr�fico irregular");
this.semaforo.setAttribute("title", "Tr�fico irregular");
}
else
{
this.semaforo.setAttribute("alt", "Tr�fico fluido");
this.semaforo.setAttribute("title", "Tr�fico fluido");
}
}
Semaforo.prototype.getDefaultPosition = function() {
return new google.maps.ControlPosition.TOP_RIGHT;
//return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(0, 0)); //TO DO
}
Semaforo.prototype.setButtonStyle_ = function(button) {
button.style.width = "19px";
button.style.height = "53px";
button.style.cursor = "default";
}
function getIconoSemaforo(color, mapa){
var semaforo = new Semaforo();
semaforo.setColor(color, mapa);
return semaforo;
}
Here is where I call the constructor and try to make/show the control
function incluirDatosXML()
{
for (var i=0; i<ciudadDato.length; i++)
{
if (i==0)
{
if (semaforoDato[i]!="no")
{
var semaforo = new Semaforo(this.semaforo, map[1]);
map[1].controls[google.maps.ControlPosition.TOP_RIGHT].push(this.semaforo);
//map[1].addControl(semaforo);
semaforo.setColor(semaforoDato[i], map[1]);
/*google.maps.event.addListener(map[1], 'idle', function() {
map[1].controls[google.maps.ControlPosition.TOP_RIGHT].push(this.semaforo);
});*/
}
}
if (i==1)
{
if (semaforoDato[i]!="no")
{
var semaforo = new Semaforo(this.semaforo, map[2]);
//map[2].addControl(semaforo);
semaforo.setColor(semaforoDato[i], map[2]);
//map[2].controls[google.maps.ControlPoistion.TOP_RIGHT].push(this.semaforo);
}
}
if (i==2)
{
if (semaforoDato[i]!="no")
{
var semaforo = new Semaforo(this.semaforo, map[3]);
//map[3].addControl(semaforo);
semaforo.setColor(semaforoDato[i], map[3]);
//map[3].controls[google.maps.ControlPoistion.TOP_RIGHT].push(this.semaforo);
}
}
$("#clima"+(i+1)).attr("class",climaDato[i]+"_mini");
$("#temp"+(i+1)).html(temperaturadDato[i]+"°");
}
}
So all you can see there is what i tested so far even there's still some comments from previous testings
if We apply any custom decorator on radio button then it will be display on next line so how
we create such custom decorator that will display inline also same for file
checked=false;
function checkedAll (frm1) {
var aa= document.getElementById('frm1');
if (checked == false)
{
checked = true
}
else
{
checked = false
}
for (var i =0; i < aa.elements.length; i++)
{
aa.elements[i].checked = checked;
}
}
function check()
{
var aa= document.getElementById('frm1');
var flag;
for(var i =0; i < aa.elements.length; i++)
{
if(aa.elements[i].type=='checkbox')
{
if(aa.elements[i].checked && aa.elements[i].id !='checkall')
{
flag = true;
}
else if(!aa.elements[i].checked && aa.elements[i].id !='checkall')
{
flag = false;
break;
}
}
}
if(flag)
{
aa.elements.checkall.checked = true;
}
else
{
aa.elements.checkall.checked = false;
}
}
function notempty()
{
var flag=false;
var all ='';
var aa= document.getElementById('frm1');
for(var i =0; i < aa.elements.length; i++)
{
if(aa.elements[i].type=='checkbox')
{
if(aa.elements.checkall.checked)
{
flag = true;
all = 'd';
break;
}
else
{//alert(aa.elements[i].id);
if(aa.elements[i].checked && aa.elements[i].id !='checkall')
{
flag = true;
all += aa.elements[i].id.replace('check','') + '~';
}
}
}
}
if(!flag)
{
alert("please select a contact to delete..");
return false;
}
if(flag)
{
//alert(all);
document.location.href= '/member/public/index/delete?all='+all;
return false;
}
}
onclick='checkedAll(frm1);'>
escape($data->id);?>"
onclick="check();">
10px;" onclick="return notempty();" value="DELETE" />