i want to create cascading drop down lookup list in sharepoint 2013. i want to take the data ,whatever i currently entered that data will be displayusing knockout js in sharepoint 2013.
so please give me some solution.
Thanks
Develop your knockout js code in separate javascript file and add that page reference to master page. Make sure to give correct path. Finally publish the master page. After publishing
your code will look like as follows.
<script type="text/javascript" src="parthtothefolder/knockout-3.0.0.js">//<![CDATA[
//]]>
</script>
<script src="parthtothefolder/yourfile.js">//<![CDATA[
//]]>
</script>
Add your html code to relevant location of the container.
Related
We are replacing the forms for our lists with forms built with SPFx. Building and deploying the form is no issue. The problem is redirecting the form controls to this form (when a user opens an item or clicks new, etc...). Is there a recommended method of accomplishing this? I have been successful using two methods but they both seem volatile and hacky.
The first being replacing the entire form code using SharePoint designer. For instance, the new form code would be
<%# Page language="C#" %>
<html lang="en">
<head>
<script type="text/javascript">
const list = window.location.href;
const site = list.substring(0,list.toLowerCase().indexOf('/lists/'));
window.location.replace(site + "/SitePages/MyListForm.aspx");
</script>
</head>
<body>
</body>
</html>
This works sometimes... Upon saving, the form code seems to regenerate the form code but the redirect still works. However, if I open and save the code again, everything breaks and the list action goes back to default (clicking new would now show the 'New Item' call out instead of directing to the form).
The other method is opening the new/edit/display form in the browser, with ?toolpaneview=2 which allows me to add a script web part to the page (although it doesnt like to save) and add the script redirect in.
<script type="text/javascript">
const list = window.location.href;
const site = list.substring(0,list.toLowerCase().indexOf('/lists/'));
window.location.replace(site + "/SitePages/MyListForm.aspx");
</script>
this seems to be less volatile than the first method, but it still seems hacky. If I delete the original form web part, the form breaks and the list actions again revert to default. Editing the script requires visiting the form with ?contents=1 to delete the script web part and then I have to re-add it again using the toolpaneview method. In order to even save the web part change I have to click "Edit Web Part", which in turn saves it. There is no simple "Save" action which again makes me feel like this method is not intended to be done.
Is there any recommended way to accomplish these redirects? I've found plenty or tutorials online about setting up the list form, but nothing about this essential step.
I've never worked before with SharePoint, that's why maybe my question is so basic but I could't find out the way to do this.
This picture contains what I've done so far.
I'm working with a SharePoint where I don't have all the administrator permitions, that's why I don't if teh option I need is disabled or just I can't find it.
You can see I have my page divided into 3 parts:
-the Left section, where I have a scheme of what i have in the middle.
-the Middle seccion, where I have the buttons.
-The Right section, this section I don't really need it so I want to delete it but I couldn't find the way to do it, and although I dont have anything there, It have a blank.
This is all the options I have in configuration:
We can add the code below into script editor web part to remove the right web part zone.
<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("div[zoneTitle='Right']").closest("tr").children("td").eq(0).attr("width","100%");
$("div[zoneTitle='Right']").closest("td").hide();
})
</script>
Or we can use CSS style to hide the Right section.
<style>
div[zoneTitle='Right']{
display:none;
}
</style>
SharePoint 2010 Custom List Form Tool Tip Field Help
I have a custom form in SharePoint and I need to add to formatted field help on mouseover, what is a good way to accomplish this?
STandard tooltips go away to fast.
Oh, by the way, we are NOT using InfoPath we are using SharePoint designer. We use to use Overlib but can't get it to work with SharePoint code.
Thanks for suggestions
We can use jQuery Tooltip from jQuery UI to achieve it. The code below for your reference:
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function(){
$("input[title='Title']").tooltip();
})
</script>
Add the code to a content editor web part in the custom form page. This code works for the Title field, you can add similar code to make it works for other fields.
I have a sharepoint list and the phone number field is in the format ###-###-#### and it ends up going to 2 lines. How can I set a width on that particular column? Do I need to do it from sharepoint designer?
there is no way to do this out of the box. Have to use sharepoint designer or jquery. Check out this msdn post
http://social.msdn.microsoft.com/Forums/en-US/sharepointcustomization/thread/f99303bb-6a95-4c05-951c-ff0185c4e864
This can be done via the xsltlistform webpart. drop it into the page in sharepoint and connect it to your list and move the columns around as needed.
Note: this is not the same as modifying the view, which as titan said is not available out of the box without opening the view page in sharepoint designer and modifying the xslt directly.
Best way is to use Alt+0160 Hard Space. Just type it once and copy this "Space" and paste as many you want!! Bingo!!
In SharePoint Designer 2010 I was able to modify column widths by opening the view I wanted to adjust, then lengthening the with of the column Title Field simply by dragging the field's box bigger.
This worked for what I was doing, but I noticed with some columns it affected others, I guess because they shared the same styling? I don't know enough to be certain.
<style>
/* new class created */
.ms-longg
{
width:500px
}
</style>
<script type="text/javascript">
$(document).ready(function(){
//removed existing class
$('input[title^="State"]').removeClass('ms-long');
//add New class for that textbox
$('input[title^="State"]').addClass('ms-longg');
});
</script>
Click here see more details
you can also use the below script to expand the width of specific column. Just edit the page then add script editor web part and add below code.
note: the column name is the internal name.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js">/script>
<script language="javascript" type="text/javascript">
jQuery(document).ready(function() {
var el = document.getElementsByName("<internal column name>");
el[0].style.width ="<size>";
});
</script>
I have a search box web part. In that web part I have created an instance of SearchBoxEx like
SearchBoxEx par=new SearchBoxEx
par.goImageUrl=""
par.DropDownMode= DropDownModes.DisplayScopeDD;
Button sear= new Button();
sear.Click += new EventHnadler(sear_Click);
I have added a button to that search Box web part.Now I have to read the scope selected in the SearchBoxEx in the sear_Click event.Can anyone please guide me in the right direction
Any help would be really appreciated.
You could read the Request.QueryString["s"] parameter, even when it is a post, the SearchBoxEx adds it.
Edit
Based on the comments and new info, are you using 'pure' javascript? This would be a jquery example:Search
WARNING: You should change the site masterpage INSIDE your site with SharePoint designer, not the one in the C:\Program Files\etc... folder. You could also navigate to the http://yourportal/_catalogs/masterpage library and download a copy of the default.master to change it then upload it back to the library, do all this carefully, you can break your sharepoint very easily.
Insert above the </HEAD> tag in your masterpage:
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
function newSearchResultsPageWithScope()
{
var scope = $(".ms-sbscopes select").val();
location.href = "/CustomResultsPage.aspx?s=" + scope;
}
</script>
The jquery portion is pretty straightforward, it gets the <td> with the class="ms-sbscopes", and the <select> element under it, then it sets the 'scope' variable to the selected value of the scopes dropdown.
Also, customizing the masterpage in a sharepoint site is fine, do not worry with that.