Dropdown using Office UI Fabric not rendering properly


while designing apps office using office ui fabric components.

i facing issue in designing drop-down.

its coming shown in below image.

i have included files in html page:

<script  src="https://code.jquery.com/jquery-3.1.1.min.js"></script> 
 <link rel="stylesheet" href="https://appsforoffice.microsoft.com/fabric/1.0/fabric.min.css">
 <link rel="stylesheet" href="https://appsforoffice.microsoft.com/fabric/1.0/fabric.components.min.css">
 <script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.2/fabric.min.js"></script>

and calling "$('.ms-dropdown').dropdown();" on document load.


hi pooja,

do mean there are no items in dropdown list? if so, share html , related js reproduce issue in simple html page?

i made test below, works correctly.

//html reference     <script src='https://cdn.rawgit.com/mikewheaton/office-ui-fabric-releases/master/1.2.1/js/jquery.fabric.min.js'></script> <script src='https://rawgit.com/mikewheaton/office-ui-fabric-releases/master/1.2.1/js/jquery.fabric.min.js'></script> //html dropdown         <div class="ms-dropdown" tabindex="0">             <i class="ms-dropdown-caretdown ms-icon ms-icon--caretdown"></i>             <select class="ms-dropdown-select">                 <option>choose sound&hellip;</option>                 <option>dog barking</option>                 <option>wind blowing</option>                 <option>duck quacking</option>                 <option>cow mooing</option>             </select>         </div> //js office.initialize = function (reason) {       $(document).ready(function () {       $('.ms-dropdown').dropdown();       var element = document.queryselector('.ms-messagebanner');       messagebanner = new fabric.messagebanner(element);       messagebanner.hidebanner();       loadprops();     });   };

in addition, suggest refer link below:

# dropdown component doesn't work
https://github.com/officedev/office-ui-fabric-core/issues/251

best regards,

edward

msdn community support
please remember click "mark answer" responses resolved issue, , click "unmark answer" if not. can beneficial other community members reading thread. if have compliments or complaints msdn support, feel free contact msdnfsf@microsoft.com.



Microsoft Office for Developers  ,  Apps for Office and SharePoint  >  Developing Apps for Office 2013



Comments

Post a Comment

Popular posts from this blog

Azure DocumentDB Owner resource does not exist

having same error microsoft.azure.documents.documentclientexception: message: {"errors":["owner resource not exist"]} , scenario. when deployed webapp azure , try document docdb throws error. docdb exists in azure , contains document looking for. weird local machine(running vs) works fine. i'm using same settings in azure , local. have , idea this. thanks Microsoft Azure  >  Azure Cosmos DB
Read more

job syspolicy_purge_history job fail in sqlserver 2008

Image
hello guys, when installed sqlserver,it automatically created 1 job name job syspolicy_purge_history. but failed @ step 1. the reason is: date                11/6/2010 2:00:00 am log                job history (syspolicy_purge_history) step id                1 server                mxosv-otsdb01 job name                syspolicy_purge_history step name                verify automation enabled. duration                00:00:00 sql severity                16 sql message id                34022 operator emailed                operator net sent                operator paged                retries attempted                0 message executed user: nt authority\system. policy automation turned off. [sqlstate 42000] (error 34022).  the step failed. have run statement: select msdb.dbo.fn_syspolicy_is_automation_enabled the returned valus 0. what can resolve it? or can delete job manually.   thanks in advance. if haven't things want,be
Read more

Trying to register with public marketplace error with 'Get-AzureStackStampInformation'

when trying register against public azure adfs azure stack error below. logs can found at: c:\maslogs\azurestack.azureregistration.2017-10-12.01-31-23.log  and  \\azs-ercs01\c$\maslogs error occurred checking stamp information: system.management.automation.remoteexception: term 'get-azurestackstampinformation' not recognized name of cmdlet, function, script file, or operable program. check spelling of name, or if path included, verify path correct , try again. @ c:\azurestack-tools-master\registration\registerwithazure.psm1:1106 char:5 +     throw "logs can found at: $global:azureregistrationlog  and  \ ... +     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~     + categoryinfo          : operationstopped: (logs can fou... , try again.:string) [], runtimeexception     + fullyqualifiederrorid : logs can found at: c:\maslogs\azurestack.azureregistration.2017-10-12.01-31-23.log  a    nd  \\azs-ercs01\c$\maslogs error occurred chec
Read more