dropdown edit type selection to read mode for few records. - JavaScript Discussion Boards

Hi I have same image in my page with same class $(.'cross') several times. When I click to get the ID of the clicked one, it does not work for the first time but it works one the second click.

I am using Gridster and my html is built dynamically on DOM Load like this with local variables.

gridster.add_widget.apply(gridster, ['<li id="li' + Grid.GridID + '" itemid="' + Grid.GridID + '" class="gs-w" data-row="' + Grid.GriddataRow + '" data-col="' + Grid.GriddataCol + '">Report id :' + Grid.GridItemid + '<table data-role="table" id="table' + Grid.GridID + '" class="icon"><tr><td><img id="cross' + Grid.GridID + '" class="cross" height="10" width="10" src="../images/Icones/cross.gif" alt="cross' + Grid.GridID + '" onclick="CloseGrid();" /></td><td><;img id="icon' + Grid.GridID + '" class="menu" height="10" width="10" src="../images/tbordmenuicon.png" alt="icon' + Grid.GridID + '" onclick="showMenu(event);GetClickedIcon();" /></td></tr></table><div id="container' + Grid.GridID + '" style="width:100%;height:100%;margin: 0 auto"></div></li>', Grid.GriddataX, Grid.GriddataY]);

And my closeGrid () function looks like this:

C#

function CloseGrid() {
                    $('.cross').click(function() {
                       var id = $(this).attr('id').replace('cross', '');
                                                alert(id);
                                          if (confirm("Voulez-vous définitivement supprimer ce graphique?")) {
                                                   gridster.remove_widget($('#li' + id), false);
                                                    DeleteChart(id);
 }
                                              else {
                                                    return false;

                                                }

                    });

                }

Could you please check and tell me what I am doing wrong?

I checked same forums about it but I could not find the problem.

Thanks in advance.

Guys,

It always happens to me that I start something with the zeal but soon I found lack of motivation continuing it.

Imagining myself a javascript expert turned me on and I decided to get certification in JS. Read few chapters and as usual just put it aside.

So trying new way of achieving the goal I am in the search of a study pal.
I wonder if anyone of you would be interested getting javascript certificate and would like to become a study pal to keep the motivation up till the end.

Some code of conduct: No personal information exchange except your name. No other conversation apart from the topic.

I am in a situation to use http://www.trirand.net/demo/aspnet/mvc/jqgrid/[^] in my project. So i just want to know whether it has MIT license or not? Is there anyone who already uses it in his/her project. Please help me through this.

So much complexity in software comes from trying to make one thing do two things.
Sibeesh

Is Google[^] not available in your company? Poke tongue | ;-P

The first result for "jqgrid license" is:

http://www.trirand.com/blog/?page_id=154[^]

The jqGrid is dual licensed and is released under GPL or MIT licenses.

"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer

Thank you . i will check it out.

So much complexity in software comes from trying to make one thing do two things.
Sibeesh

you can get complete detail from below
http://www.trirand.com/jqgridwiki/doku.php?id=wiki:dokuwiki[^]

Thank you . i will check it out.

So much complexity in software comes from trying to make one thing do two things.
Sibeesh

hi,
I have a requirement in the jqgrid data that totally 3 columns in that one is name,date and one column called department where the edit type is select have two options education and humanresources.

for some records like up to this month 10/31 the records should be editable , i mean we can select some thing and we can update. only the current month should be editable and next month data should not editable we can view it but not edit just like should be in read mode.

How to approach this scenario?

$("#grid").jqGrid({
url: 'Handler.ashx',
datatype: 'json',
height: 250,
colNames: ['Name','Department', 'Date'],
colModel: [
{ name: 'Name', index: 'Name', width: 256, stype: 'text', editable: true, sortable: false, editoptions: { disabled: "disabled"} },
{ name: 'Department', index: 'Department', width: 256, stype: 'text', sortable: false, editable: true, edittype: 'select',
formatter: rowColorFormatter,
editoptions: { value: "Education:Education; Humanresource:Humanresource" }},
{ name: 'Date', index: 'Date', width: 256, editable: true, stype: 'text', sortable: true, sorttype: 'date', editoptions: { disabled: "disabled"} }
],
rowNum: 100,
loadonce: true,
rowList: [100, 200, 300],
pager: '#pager',
sortname: 'name',
viewrecords: true,
sortorder: 'asc',
gridview: true,
ignoreCase: true,
caseSensitive: false,
rownumbers: true,
reloadAfterSubmit: false,
width: 1024,
gridComplete: function() {
for (var i = 0; i < rowsToColor.length; i++) {
var Department = $("#" + rowsToColor[i]).find("td").eq(2).html();
if (Department == "Humanresource") {
$("#" + rowsToColor[i]).find("td").css("background-color", "red");
}
}
},
jsonReader: {
repeatitems: false
},
caption: 'Department Update',
editurl: 'Handler.ashx',
onSelectRow: function(id) {
if (id && id !== lastSelectedId) {
$('#grid').restoreRow(lastSelectedId);
$('#grid').editRow(id, true);
lastSelectedId = id;
}

},

afterSubmit: function() {

$(this).jqGrid("setGridParam", { datatype: 'json' });
return [true];
alert("returnvalue");
}

});

function rowColorFormatter(cellValue, options, rowObject) {
if (cellValue == "Humanresources")
rowsToColor[rowsToColor.length] = options.rowId;
return cellValue;
};

$("#grid").setGridParam({ sortname: 'CalDate', sortorder: 'asc' }).trigger('reloadGrid');

$("#grid").jqGrid('navGrid', '#pager',
{
edit: false,
add: false,
del: false,
search: true,
searchtext: "Search",
reloadAfterSubmit: true,
cloneToTop: true,
overlay: false,
beforeRefresh: function() {
$("#grid").setGridParam({ datatype: 'json', page: 1 }).trigger('reloadGrid');

}
}

});

$("#grid").jqGrid('filterToolbar', { stringResult: true, searchOnEnter: true, defaultSearch: "cn" }).navButtonAdd('#pager', {
caption: "Export to Excel",
buttonicon: "ui-icon-disk",
onClickButton: function() {
ExportDataToExcel("#grid");
},
position: "last"
});

$("#grid").jqGrid('editRow', {

aftersavefunc: function() {

onEnterrowdetails('#list');

}

});
});

function ExportDataToExcel(tableCtrl) {

ExportJQGridDataToExcel(tableCtrl, "MKS.xlsx");

}
function onEnterrowdetails() {
$('#<%=lblMessage.ClientID%>').html(" Data Updated");
return true;
}
</script>

</form>
</body>
</html>

We have a .Net webservice which runs on one server and a web application (javascript) running on another. The webservice needs to have Windows Authentication.

We keep getting the error 401 Unauthorized on the CORS Preflight call, which preceeds the cross domain webservice call. If we move the webservice on the same machine as the application, the calls run perfectly.

Spent four days now to get it working, hopefully someone here can point me in the right direction...

P.S.: added a JSFiddle which demonstrates the problem. http://jsfiddle.net/mr9Lpbc1/34/[^]

Here is the web.config we use for the webservice

XML

<?xml version="1.0" encoding="UTF-8"?>
<configuration>

  <appSettings />
  <connectionStrings />
  <system.web>
    <compilation debug="true" />
    <authentication mode="Windows" />
    <customErrors mode="Off" />
    <webServices>
      <protocols>
        <add name="HttpSoap" />
        <add name="HttpGet" />
        <add name="HttpPost" />
      </protocols>
    </webServices>
	<httpRuntime maxUrlLength="9999" relaxedUrlToFileSystemMapping="true" maxQueryStringLength="2097151" requestValidationMode="2.0"/>
    <pages validateRequest="false" />
  </system.web>
  <system.webServer>
    <defaultDocument>
      <files>
        <remove value="default.aspx" />
        <remove value="Default.asp" />
        <remove value="index.html" />
        <remove value="iisstart.htm" />
        <remove value="index.htm" />
        <remove value="Default.htm" />
        <add value="webservice.asmx" />
      </files>
    </defaultDocument>
        <httpProtocol>
            <customHeaders>
                <add name="Access-Control-Allow-Origin" value="http://domain.nl" />
                <add name="Access-Control-Allow-Credentials" value="true" />
                <add name="Access-Control-Allow-Headers" value="SOAPAction, Content-Type,Authorization" />
                <add name="Access-Control-Allow-Methods" value="GET, POST, OPTIONS" />
            </customHeaders>
        </httpProtocol>
	  <security>
		  <requestFiltering>
			  <requestLimits maxUrl="10999" maxQueryString="9999" />
		  </requestFiltering>
	  </security>
  </system.webServer>
</configuration>

Here is the peace of javascript we are using

JavaScript

SOAPClientParameters = (function () {
    function SOAPClientParameters() {
        var self = this;

        self.list = new Array();
    }

    SOAPClientParameters.prototype.add = function (name, value) {
        var self = this;

        self.list[name] = value;
        return self;
    };

    SOAPClientParameters.prototype._serialize = function (o) {
        var s = "";
        switch (typeof (o)) {
            case "string":
                s += o; //real code is a little different but includes >
            case "number":
            case "boolean":
                s += o.toString(); break;
            case "object":
                // Date
                if (testNull(o)) { s += ""; }
                else if (typeof o === 'Date') {
                    dateToSqlString(o); // custom external function to create date to string suitable for MSSQL
                }
                else if (typeof o === 'Array') {
                    for (var p in o) {
                        if (!isNaN(p))   // linear array
                        {
                            (/function\s+(\w*)\s*\(/ig).exec(o[p].constructor.toString());
                            var type = RegExp.$1;
                            switch (type) {
                                case "":
                                    type = typeof (o[p]);
                                case "String":
                                    type = "string"; break;
                                case "Number":
                                    type = "int"; break;
                                case "Boolean":
                                    type = "bool"; break;
                                case "Date":
                                    type = "DateTime"; break;
                            }
                            s += "<" + type + ">" + SOAPClientParameters._serialize(o[p]) + "</" + type + ">"
                        }
                        else    // associative array
                            s += "<" + p + ">" + SOAPClientParameters._serialize(o[p]) + "</" + p + ">"
                    }
                }
                else
                    for (var p in o)
                        s += "<" + p + ">" + SOAPClientParameters._serialize(o[p]) + "</" + p + ">";
                break;
            default:
                throw new Error(500, "SOAPClientParameters: type '" + typeof (o) + "' is not supported");
        }
        return s;
    }

    SOAPClientParameters.prototype.toXml = function () {
        var self = this;

        var xml = "";
        for (var p in self.list) {
            if (typeof self.list[p] !== 'function') {
                xml += "<" + p + ">" + self._serialize(self.list[p]) + "</" + p + ">";
            }
        }
        return xml;
    }

    return SOAPClientParameters;
}());


SOAPClient = (function () {
    function SOAPClient(url, async) {
        var self = this;

        self.xmlHttp = null;

        if (window.XMLHttpRequest) {
            self.xmlHttp = new XMLHttpRequest();
            // patch for Moz (some versions)
            if (self.xmlHttp.readyState == null) {
                self.xmlHttp.readyState = 1;
                self.xmlHttp.addEventListener("load",
                                    function () {
                                        self.xmlHttp.readyState = 4;
                                        if (typeof self.xmlHttp.onreadystatechange == "function")
                                            self.xmlHttp.onreadystatechange();
                                    },
                                    false);
            }
            //req.withCredentials = true; // tried this, but didn't work
        } else {
            throw 'This browser is not supported!';
        }

        self.xmlHttp.async = async;
        if (self.xmlHttp !== null) {
            self.xmlHttp.open("POST", url, self.xmlHttp.async);
            self.xmlHttp.url = url;
            self.xmlHttp.setRequestHeader("Content-Type", "text/xml; charset=utf-8");
            self.xmlHttp.onerror = function () { // handle eg. 40x errors
                if (self.xmlHttp.async) {
                    // resend it synchronous and catch the exception
                    var errorClient = new SOAPClient(self.xmlHttp.url, false);
                    var exception = errorClient.invoke(self.xmlHttp.func, self.xmlHttp.parameters, function () { }, function () { });
                    self.xmlHttp.errorCallback(isnull(exception.message, 'Unknown error...'));
                }
            }

            self.xmlHttp.onload = function () { // handle eg. 50x errors
                if ((self.xmlHttp.readyState === 4) && (self.xmlHttp.status !== 200)) {
                    self.xmlHttp.errorCallback(self.xmlHttp.statusText);
                }
            }
        }
    }

    SOAPClient.prototype.result = function (data) {
        return data;
    };

    SOAPClient.prototype.invoke = function (method, parameters, successCallback, errorCallback) {
        var self = this;

        var ns = 'http://domain.com/';
        var sr = "<?xml version=\"1.0\" encoding=\"utf-8\"?>" +
            "<soap:Envelope " +
            "xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\" " +
            "xmlns:xsd=\"http://www.w3.org/2001/XMLSchema\" " +
            "xmlns:soap=\"http://schemas.xmlsoap.org/soap/envelope/\">" +
            "<soap:Body>" +
            "<" + method + " xmlns=\"" + ns + "\">" +
            parameters.toXml() +
            "</" + method + "></soap:Body></soap:Envelope>";

        var soapaction = ((ns.lastIndexOf("/") != ns.length - 1) ? ns + "/" : ns) + method;

        self.xmlHttp.function = method;
        self.xmlHttp.parameters = parameters;
        self.xmlHttp.errorCallback = errorCallback;

        self.xmlHttp.setRequestHeader("SOAPAction", soapaction);

        if (self.xmlHttp.async) {
            self.xmlHttp.onreadystatechange = function () {
                if ((self.xmlHttp.readyState == 4) && (self.xmlHttp.status === 200)) {
                    self.onSuccess();
                }
            }
        }

        try {
            self.xmlHttp.send(sr);
            if (!self.xmlHttp.async) {
                self.onSuccess();
            }
        } catch (ex) {
            return ex;
        }
    }

    SOAPClient.prototype.onSuccess = function () {
        var self = this;

        if ((self.xmlHttp.readyState == 4) && (self.xmlHttp.status === 200)) {
            var o = null;
            var responseText = self.xmlHttp.response;

            // do the success callback here
        }
    }

    return SOAPClient;
}());

modified 9-Oct-14 8:03am.

i am new here Cool | :cool:

That does not exempt you to make some effort - http://mattgemmell.com/what-have-you-tried/[^]

I'm not questioning your powers of observation; I'm merely remarking upon the paradox of asking a masked man who he is. (V)

struggling to figure out this program. beginner javascript programmer.
My task is to write a program that does this: Stores the 50 states' names and capitals in two arrays (which I have).
Uses the window.prompt() method to display a state name, asks the user to enter the matching capital name, and tells the user that entering "exit" will stop the program.
Checks the user input and use the window.prompt() method to tell the user if the answer is correct or not. At the same time, the window.prompt() method displays the next state name, and asks the user to enter the next matching capital name. Please note that giving the user feedback and prompting the user to try the next are done with the same window.prompt().
Uses a loop to go through all 50 states until all 50 states have been displayed or the user enters "exit".

Any guidance would be much appreciated. Even just getting pointed in the right direction. I've read through many tutorials and just can't seem to get it. Thank you.

Post only once please!

I'm not questioning your powers of observation; I'm merely remarking upon the paradox of asking a masked man who he is. (V)

struggling to figure out this program. beginner javascript programmer.
My task is to write a program that does this: Stores the 50 states' names and capitals in two arrays (which I have).
Uses the window.prompt() method to display a state name, asks the user to enter the matching capital name, and tells the user that entering "exit" will stop the program.
Checks the user input and use the window.prompt() method to tell the user if the answer is correct or not. At the same time, the window.prompt() method displays the next state name, and asks the user to enter the next matching capital name. Please note that giving the user feedback and prompting the user to try the next are done with the same window.prompt().
Uses a loop to go through all 50 states until all 50 states have been displayed or the user enters "exit".

Any guidance would be much appreciated. Even just getting pointed in the right direction. I've read through many tutorials and just can't seem to get it. Thank you.

Member 11116351 wrote:
My task

So start do it! Do not wait for us to do it for you! Thing are work a bit differently. YOU came with some (probably imperfect) solution and WE help you make it work...

I'm not questioning your powers of observation; I'm merely remarking upon the paradox of asking a masked man who he is. (V)

Start at http://www.w3schools.com/js/default.asp[^]. If you really cannot understand it from there then it's time to talk to your teacher and expalin what your problem is.

Please do not post same question multiple times

I tried the ckEditor forum but I was listed as a spammer and denied a post, until they resolve it.

Any body here know much about ckEditor Custom Plugins, and the element ID system?

[SOLVED]

Well the ckEditor forum was no help either. But I figured it out the next day.

modified 26-Sep-14 17:53pm.

Hi,
I am gonna start a new web application which gives more importance to client side rather than server side. So we have so many technologies to achieve the client side scripting. eg :- JQuery,JavaScript,Angular JS. Among these which one should i use for my project?

Thanks In Advance
Sibeesh

you can start with jQuery.

Vindhyachal Kumar

Ok thanks for your reply.

0) Forget Javascript.
1) Go with jQuery which is better than Javascript.
2) If you don't believe, do Google search for "Javascript vs jQuery"
3) AngularJs is a javascript library like jQuery but it's also framework. Some people use Angular to create SPA.
Here a CP article. 10 Reasons Web Developers Should Learn Angular[^]
and one more post. 10 Reasons Why You Should Use AngularJS[^]

If you want to perform just client side operations, go with jQuery which is more than enough. And it'd be better to learn jQuery before start learning other javascript libraries like AngularJs, KnockOutJs, etc.,

thatraja

Code converters | Education Needed | Improve Everything^New

thatraja wrote:
Go with jQuery which is better than Javascript.

jQuery IS javascript. Big Grin | :-D

But yes, it is an easier way to use JavaScript.

There are only 10 types of people in the world, those who understand binary and those who don't.

yes

Thank you

Those links are useful