Showing posts with label HTML. Show all posts
Showing posts with label HTML. Show all posts

Friday, February 10, 2017

Suggestions or Auto populate values in textbox using JQuery and C#(SharePoint 2013)


I have done this on SharePoint application page which is deployed under layouts folder, this can be also used in .net applications.
below is images shows you populated suggestions that are saved in database


First fill the data inside a gridview/table with fields that you need to auto populate
this can be done based on your coding capabilities

once you do it hide the table so that anyone cannot see it using CSS or code in my case i did with CSS
.GridHide is my class for hiding gridview and below other two classed is used to autocomplete list

<style type="text/css">
.GrdHide {
            display:none;
        }
        ul.ui-autocomplete {
    list-style: none;
}
.ui-autocomplete {
    height: 200px;
    overflow-y: scroll;
    overflow-x: hidden;

}
</style>

Code in JQuery to populate table data inside textbox i did this for two textboxes for project name and project number you can repeat the same as many columns you want

function GetData() {
            var MYProjNumb = new Array();
            var MYProjName = new Array();

            var table = $("#ctl00_PlaceHolderMain_hiddenGrd tbody"); //my table ID

            table.find('tr').each(function (i) {
                var $tds = $(this).find('td'),
                    ProjectNumber = $tds.eq(0).text(),
                    ProjectName = $tds.eq(1).text(),


                //alert('Row ' + (i + 1) + ':\npNumber: ' + ProjectNumber
                //      + '\nPName: ' + ProjectName);
                MYProjNumb.push(ProjectNumber);
                MYProjName.push(ProjectName);

            });
            ProjNumber(MYProjNumb);
            ProjName(MYProjName);
        }
        function ProjNumber(list) {
            var PJlst = GetUnique(list);
            $("[id*=txtProjNum]").autocomplete({
                source: PJlst,
                select: function (event, ui) {
                }
            });
        }
        function ProjName(list) {
            var PNLst = GetUnique(list);
            $("[id*=txtProjectName]").autocomplete({
                source: PNLst,
                select: function (event, ui) {
                }
            });
        }

to display only unique values in auto suggestion box then use the below code

        function GetUnique(list)
        {
            var unique = list.filter(function (itm, i, a) {
                return i == a.indexOf(itm);
            });
            return unique;
        }

call the above GetData() method on load of page

    <script type="text/javascript">
        $(function () {
            GetData();
});
</script>

all set...now you have auto populate textboxes on your page
limit your table data to 50 so that page loads faster.

Wednesday, November 16, 2016

Checking selected value in all dropdowns using jquery


Below code works if you have multiple drop downs where you want to check the selected value in all drop downs  in the form and see if this value is selected already, if selected then will show an alert message and change the selected value of that particular drop down


Add the "OnChange" in dropdown events as this onchange="ChkCurrent(this);
where 'id' is current value dropdown
 function ChkCurrent(id) {   
            var ddlValues = new Array();
            $("[id*='ddlstsCurrM']").each(function (i) {
                if ($(this).val()== 1) {
                    ddlValues.push($(this).val());
                }

            });
            if (ddlValues.length > 1)
            {
                alert("This value has been already selected");
                var ddlid ="#"+id.id;
                $(ddlid).val('0');

            }
        }

SharePoint - Cannot convert a primitive value to the expected type 'Edm.Double'. See the inner exception for more details If y...

Ad