In the Web form’s List view I want to add a filter to the project field .How can i gain access to this Web Form’s list page ? I can access the Doctype’s List view with this code .
frappe.listview_settings["Doctype'] = {
}
But how can I gain access to web form’s Listview .
i was able to achieve this by this code . i created a new filter and placed it there from the ground up
frappe.ready(function() {
const observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type === 'childList' || mutation.type === 'attributes') {
if (frappe.web_form_list && Object.keys(frappe.web_form_list).length > 0) {
console.log("Custom script for tickets web form list loaded");
frappe.call({
method: "path",
args: {
user: frappe.session.user
},
callback: function(r) {
if (r.message) {
let projectOptions = r.message.map(project => ({
label: project.project_name,
value: project.name
}));
// Add an empty option at the beginning
projectOptions.unshift({ label: '', value: '' });
// Create the Select control
let projectFilter = frappe.ui.form.make_control({
df: {
fieldtype: "Select",
// label :"Project",
fieldname: "project",
options: projectOptions,
onchange: function(event) {
let selectedProject = projectFilter.get_value();
frappe.web_form_list.filters = {
project: selectedProject || undefined
};
frappe.web_form_list.refresh();
}
},
parent: $(".web-list-filters"),
render_input: true
});
// Add custom styles for height
$(projectFilter.wrapper).css({
height: '70px', // Adjust the height as needed
padding: '0px'
});
// Add tooltip and placeholder
$(projectFilter.wrapper)
.addClass("col-md-3")
.attr("title", __("Project"))
.tooltip({
delay: { show: 600, hide: 100 },
trigger: "hover"
});
projectFilter.$input.attr("placeholder", __("Select Project"));
// Push the filter into the web_form_list filter_input array
frappe.web_form_list.filter_input.push(projectFilter);
// Disconnect the observer after setting filters
observer.disconnect();
}
}
});
}
}
});
});
// Start observing the target node for mutations
const targetNode = document.querySelector('.web-list-table');
if (targetNode) {
observer.observe(targetNode, {
childList: true,
attributes: true,
subtree: true
});
}
});